javascript - jquery timepicker设置时间点击功能

Question

jquery timepicker 设置按钮点击功能不起作用。

我试图将一个类添加到 <div id="ptTimeSelectSetButton">

使用 $('#ptTimeSelectSetButton a').addClass('timePickClass');

<div id="ptTimeSelectSetButton">它是时间选择器中的一个 div

我尝试在 div 中使用 div id 和 '' 标签添加点击功能。

不幸的是，点击功能不起作用。如果有人知道原因，请在这里分享。

HERE DEMO

html页面

Start Time <input id="sample1" type="text"></input>
End Time <input id="sample2" type="text"></input>

脚本

$(document).ready(function(){ 
    $("#sample1").ptTimeSelect();
    $("#sample2").ptTimeSelect();
    $('#ptTimeSelectSetButton a').addClass('timePickClass');
}); 
// click on div
$('#ptTimeSelectSetButton').click(function(e) {
          alert('Working with div id');
});
//or click on <a href> tag 
$(".timePickClass").click(function(e) {
    alert('working with a tag class');
});

Answer 1

您必须将点击事件放在 $(document).ready 中，或者像其他人所说的那样使用事件委托(delegate):

$(document).ready(function(){ 
    $("#sample1").ptTimeSelect();
    $("#sample2").ptTimeSelect();
    $('#ptTimeSelectSetButton a').addClass('timePickClass');

    //or click on <a href> tag 
    $(".timePickClass").click(function(e) {
        alert('working with a tag class');
    });
    // click on div
    $('#ptTimeSelectSetButton').on('click', function(e) {
              alert('Working with div id');
    });
});