【问题标题】:Jquery .live works but not with .datepickerJquery .live 有效,但不适用于 .datepicker
【发布时间】:2010-12-07 20:09:50
【问题描述】:

感谢您的关注,所有真诚有用的答案都被投票赞成。 当页面加载时,我有一些日期输入字段,还有一些动态生成的字段。每次生成新实例时,我都没有在该类上调用 .datepicker(),而是使用 .live,但它似乎不起作用。知道为什么吗?

$("input[name=myfav]").live("click", function(){
    $(this).datepicker({ 
        /* some options here */ 
    });
});

我应该提一下,例如,它与自动完成功能完美配合。

$("input[name=mytwo]").live("click", function(){
    $(this).autocomplete("somefile.php");
});

【问题讨论】:

    标签: javascript jquery syntax datepicker


    【解决方案1】:

    这是一篇关于在 jQuery 中使用 .live-event 的日期选择器的文章:

    http://www.vancelucas.com/blog/jquery-ui-datepicker-with-ajax-and-livequery/

    问题是 Datepicker 默认通过绑定到 focus() 事件来工作,但是从 jQuery 1.3.2 开始,“live”事件函数无法监视“focus”事件。

    这是来自网站的解决方法::

    <script type="text/javascript">
    $(function(){
        $('input.calendarSelectDate').live('click', function() {
            $(this).datepicker({showOn:'focus'}).focus();
        });
    });
    </script>
    

    编辑:不再需要这种解决方法,因为 jQuery 1.4.1+ 现在支持 live() 的焦点和模糊事件。 (感谢@Chris S

    【讨论】:

    • 感谢您的回复。我知道这是插件相关的,因为其他插件工作正常。这澄清了它。
    • 遇到了同样的问题。对我们来说,完成这项工作的另一部分是确保每个日期选择器输入都有一个唯一的 ID。否则,至少在 Google Chrome 中,您可以单击任何输入并获得一个日期选择器,但它实际上会更改第一个具有该 ID 的日期。 (当然,从语义上讲,ID 应该始终是唯一的,但这就是错误。)
    • 我在选择日期选择器后仍然无法关闭它。尝试将焦点移动到下一个输入,但它不起作用。因此,在关闭时,我销毁日期选择器,然后在单击时重新绑定。有点像黑客,但它现在对我有用。
    【解决方案2】:

    这就是我最终使用的。它在较新的 jQuery 中利用了 livefocus

    $.datepicker.setDefaults({ dateFormat: 'yy-mm-dd', ... });
    $('input.date').live('focus', function() {
        $(this).datepicker().datepicker('show');
        true;
    });
    

    【讨论】:

      【解决方案3】:

      值得注意的是,jQuery 1.4.1+ 现在支持 live() 的焦点和模糊事件,因此不再需要这种变通方法,虽然很酷,但原始海报的版本可以正常工作!

      【讨论】:

      • 它对我来说不太有效,但是 $(".date").live("focus",function() { $(this).datepicker({ dateFormat: 'dd/mm/ yy' }) });做了
      【解决方案4】:

      更新:从 jQuery 1.7 开始,不推荐使用 .live() 方法。 1.7、使用 .on() 附加事件处理程序。参考:http://api.jquery.com/live/

      【讨论】:

        猜你喜欢
        • 2015-02-13
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2012-10-17
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多