栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

Ajax刷新后如何绑定jQuery Datepicker?

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

Ajax刷新后如何绑定jQuery Datepicker?

jQuery

.on()
函数用于延迟事件处理,但不适用于插件初始化。

它适用于事件,因为DOM模型将事件从DOM元素传播到其父元素,一直到顶部。因此,当您单击链接时,您还将同时单击包含该链接的任何内容(

div
例如a),包含该容器的所有内容,等等,一直到
body
标记,最后是标签
document
本身。
.on()
通过绑定到公共父元素而不是动态子元素的click事件来利用此优势,因此可以添加/删除子元素而不会丢失父元素上的事件处理程序。

不过,插件初始化无法以这种方式工作。为了在目标元素上初始化插件, 必须
在元素本身上完成,这意味着该元素当时必须位于DOM中。因此,当您动态添加新元素时,您需要定位这些新元素并在其上初始化插件。因此,您

success
需要通过AJAX调用来执行此功能。

注意,由于您的AJAX调用本身 内部 的初始化,你将需要分割其中的一些分成不同的功能进行再利用。否则,此重新初始化将无限期地嵌套在其内部。

也许是这样的:

var datePickerClose = function (dateText, inst) {    var selectedDate = $(this).datepicker("getDate"); //Date object    $.ajax({        url: "/url",        dataType: "json",        method: 'post',        data: { value: selectedDate.toDateString() + ' ' + selectedDate.toTimeString()        },        beforeSend: function () { $("#loading").fadeIn();        },        success: function (data, textStatus) { $("#content").html(data); $("#content").find("[id^=startPicker]").each(function () {     bindDatePicker(this); });        },        complete: function () { $("#loading").fadeOut();        }    });};var bindDatePicker = function(element) {    $(element).datetimepicker({        showOn: "button",        buttonImage: "/img/calendar_icon.png",        buttonImageOnly: true,        dateFormat: 'mm/dd/yy',        timeFormat: 'hh:mm tt',        stepMinute: 1,        onClose: datePickerClose    });};$("[id^=startPicker]").each(function() {    bindDatePicker(this);});

当然,这只是徒手的未经测试的代码,目的只是为了演示该概念。这可能需要一些调整,并且可能会有更优雅的方法来实现相同的逻辑。



转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/380939.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号