Question

我使用jQuery datepicker并需要一个自动执行的函数才能正常工作，所以我的JS看起来像：

    $(function(){
        $('#datepicker').datepicker({
            // beforeShowDay: disableSpecificDays,
            inline: true,
            showOtherMonths: true,
            dayNamesMin: [ "M", "T", "W", "T", "F", "S", "S" ],
        });

        $('#datepicker td').on('click', function() {
            console.log($(this).text());
        });
    });

我的onClick事件有效，但只触发一次。如果我把它从功能中拿出来它就根本不会发射。

有谁知道为什么？

Answer 1

尝试使用onSelect事件：

$('#datepicker').datepicker({
     onSelect: function(dateText, inst) { 
        console.log(dateText);
         // you code here.. 
     }
 });

选择日期选择器时调用。该函数接收所选日期作为文本，并将datepicker实例作为参数接收。这指的是相关的输入字段。

或者，您只需将事件重新附加到ui-datepicker元素：

   var element = document.getElementById('datepicker'),
    cols = element.getElementsByTagName("td");

   attachEvents(); // call function on load

   function attachEvents() {
     for(var i = 0; i < cols.length; i++) {
         cols[i].addEventListener("click", function (ev) {
            console.log(this);
            attachEvents();
          }, false);
     }
    }

Answer 2

当您附加单击侦听器时，DOM元素尚不存在。要解决此问题，您需要使用委托事件。尝试使用此代码段：

$(function() {
    $('#datepicker').datepicker({
        // beforeShowDay: disableSpecificDays,
        inline: true,
        showOtherMonths: true,
        dayNamesMin: ["M", "T", "W", "T", "F", "S", "S"],
    });

    $('#datepicker').on('click', 'td', function() {
        console.log($(this).text());
    });
});

在自动执行函数jQuery中onClick on fires一次

2 个答案: