当前位置:  开发笔记 > 前端 > 正文

为什么jQuery UI的datepicker会破坏动态DOM?

如何解决《为什么jQueryUI的datepicker会破坏动态DOM?》经验,为你挑选了2个好方法。

我在这里使用动态DOM,并将jQuery UI datepicker调用到具有特定类名的所有输入,在这种情况下 .date

它适用于第一个静态构造,但是当我克隆它时,事件处理程序似乎不想移动.我收到Firebug错误:

inst未定义

我试着研究jQuery的新live()功能,但无法将两者结合起来.有任何想法吗?



1> Will Morgan..:

啊,明白了.在我将HTML附加到DOM之后,我在所有输入上运行此操作,我希望弹出一个日期选择器.Datepicker为它附加的元素添加了一个类,因此我们可以过滤掉现有的输入并仅将其应用于新的输入.

$('.date').not('.hasDatePicker').datepicker();

我希望这可以帮助人们,因为我谷歌搜索了几天,没有找到任何东西!

您还应该注意,通过将其input.date设置为上下文而不是整个页面来检查新生成的HTML 会更快,因为这将节省时间,因为这是一个更有效的操作.


当使用动态DOM时,当我(jquery)克隆带有事件的表行时,这个解决方案没有帮助我.我的解决方案是做$('.date').removeClass('hasDatepicker').datepicker();
威尔,非常感谢!你节省了我几个小时的生命:)

2> Richipal..:

我有一个类似的问题,我在一个页面上有多个表,每个表有多个日期选择器,也点击按钮"AddLine"它添加了一个动态HTML和日期选择器的表行.

经过大量搜索,我意识到我的输入日期字段没有定义"id",它们看起来像这样


jquery将所有日期字段值指向页面上定义的第一个日期字段,日历将在所有日期字段上弹出,但第一个日期字段的值将更改,我对此更改了html


通过添加"id"并开始工作,对于动态日期字段,我更改了Id

var allColumns = $("#"+$tableId+" tr:last td"); 
        $(allColumns).each(function (i,val) {
            if($(val).find(":input").hasClass("datepicker")){
                $(val).find(":input").attr("id",newId+$(val).find(":input").attr("id"));
            }
        });

推荐阅读
kikokikolove
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有