单击“不开火”按钮

Question

我有一个html按钮，连接到我的页面顶部的JQuery函数，但点击似乎没有开火?我是不是漏掉了什么?

$(function(){
                $('#ctl00_content_hidePast').click(function() {
                    var dt = new Date($.now() - 30 * 60000);
                    var time = dt.getHours() + ":" + dt.getMinutes() + ":" + dt.getSeconds();
                    $("td.bgtime").each(function() {
                        var bookingTime = ($(this).text().split(':'));
                        var d = new Date();
                        d.setHours(+bookingTime[0]);
                        d.setMinutes(bookingTime[1]);
                        var state = $("#ctl00_content_hdnPastBookingToggle").val();
                        if ($(d) > time) {
                            var timeRow = $(this).parent();
                            $(timeRow).toggle("slow",
                                function() {
                                    if (state.val === "0") {
                                        state.val = "1";} 
                                    else if (state.val === "1") {
                                        state.val = "0";
                                    };
                                });
                        };
                    });
                });
            });

和按钮:

<button id="ctl00_content_hidePast"><i class='fa fa-eye-slash'></i> Hide/Show Past Bookings</button>

Answer 1

try

$(function(){
                $(document).on('click','#ctl00_content_hidePast', function() {
                    var dt = new Date($.now() - 30 * 60000);
                    var time = dt.getHours() + ":" + dt.getMinutes() + ":" + dt.getSeconds();
                    $("td.bgtime").each(function() {
                        var bookingTime = ($(this).text().split(':'));
                        var d = new Date();
                        d.setHours(+bookingTime[0]);
                        d.setMinutes(bookingTime[1]);
                        var state = $("#ctl00_content_hdnPastBookingToggle").val();
                        if ($(d) > time) {
                            var timeRow = $(this).parent();
                            $(timeRow).toggle("slow",
                                function() {
                                    if (state.val === "0") {
                                        state.val = "1";} 
                                    else if (state.val === "1") {
                                        state.val = "0";
                                    };
                                });
                        };
                    });
                });
            });

在本例中，您将事件绑定到文档。这通常用于动态dom元素。您不需要将click事件绑定到文档。实际上，建议将它附加到非动态父节点。例如将包含按钮的div。在这种情况下，代码将是:

  $(document).on('click','div that contains the buttons selector', function() ..

它只是让事情变得更轻。但由于我没有dom结构所以我给了你们一个在任何情况下都适用的答案

Answer 2

如果你使用的是动态按钮，你必须使用以下代码:

$(function(){
                $('#ctl00_content_hidePast').on("click", function() {
                    var dt = new Date($.now() - 30 * 60000);
                    var time = dt.getHours() + ":" + dt.getMinutes() + ":" + dt.getSeconds();
                    $("td.bgtime").each(function() {
                        var bookingTime = ($(this).text().split(':'));
                        var d = new Date();
                        d.setHours(+bookingTime[0]);
                        d.setMinutes(bookingTime[1]);
                        var state = $("#ctl00_content_hdnPastBookingToggle").val();
                        if ($(d) > time) {
                            var timeRow = $(this).parent();
                            $(timeRow).toggle("slow",
                                function() {
                                    if (state.val === "0") {
                                        state.val = "1";} 
                                    else if (state.val === "1") {
                                        state.val = "0";
                                    };
                                });
                        };
                    });
                });
            });

或(弃用)

$(function(){
                $('#ctl00_content_hidePast').live("click", function() {
                    var dt = new Date($.now() - 30 * 60000);
                    var time = dt.getHours() + ":" + dt.getMinutes() + ":" + dt.getSeconds();
                    $("td.bgtime").each(function() {
                        var bookingTime = ($(this).text().split(':'));
                        var d = new Date();
                        d.setHours(+bookingTime[0]);
                        d.setMinutes(bookingTime[1]);
                        var state = $("#ctl00_content_hdnPastBookingToggle").val();
                        if ($(d) > time) {
                            var timeRow = $(this).parent();
                            $(timeRow).toggle("slow",
                                function() {
                                    if (state.val === "0") {
                                        state.val = "1";} 
                                    else if (state.val === "1") {
                                        state.val = "0";
                                    };
                                });
                        };
                    });
                });
            });