Question

这是我遇到的问题。

我正在为某些设备制作控制面板。现在，用户可以启用/切换开/关开关（复选框），也可以启用远程设备。这反映在数据库中。但是，每当用户（不是设备）切换为启用设备时，我也想要一个确认框（复选框==选中）。当用户禁用（切换关闭，复选框== false）设备时，不需要确认框。我每隔几秒检查一次数据库以查看设备状态（因为设备可以打开或关闭）

这是我到目前为止（它没有正常工作。没有任何内容发送到数据库。点击doeesn并触发用户点击复选框）

$(function() {
    $('#toggle').bootstrapToggle({
      on: TR_Toggle_On,
      off: TR_Toggle_Off
    });
    check_enable();

    function check_enable() {
        var timer = setInterval(function(result) {
            $.ajax({
                type: "get",
                url: "checkState.php",
                success: function(result) {
                    var enabled =parseInt(result);
                    if (enabled ===1) {
                        $( '#toggle').bootstrapToggle('on');
                    } else {
                        $( '#toggle').bootstrapToggle('off');
                    }
                }
            });
        }, 5000);
    }

    $('#toggle').on('click',function(){
        $('#toggle').change(function() {
            if ($('#toggle').prop('checked') ===true) {
                if(confirm("Sure?")){
                    $.ajax({
                    type: "get",
                    url: "setEnable.php",
                    data: "enable=1"
                    });
                }else{
                    $('#toggle').prop('checked',false);
                }
            } else {
                $.ajax({
                    type: "get",
                    url: "setEnable.php",
                    data: "enable=0"
                });
            }
        })
    })


})

我该怎么做？当我尝试注册on（＆＃39; click＆＃39;，func（）{}）事件时，什么都不会触发。我认为它不适用于复选框？我做错了什么？

Answer 1

是的，它适用于复选框。

试过这样一个最小的例子：

<input type="checkbox" class="toggle" name="dog" value="TinyDog" /> what does the dog say

$(document).ready(function() {
 $('.toggle').on('click',function(){
  alert("woff woff");
  }); 
});

尝试添加一些console.log行或警报，以查看代码失败的位置。

Answer 2

您正在另一个事件中绑定一个事件..

$('#toggle').on('click',function(){
    $('#toggle').change(function() {
    ...
    }
}

你应该只绑定一次，就像这样...

    $('#toggle').on('click',function(){
        if ($('#toggle').prop('checked') ===true) {
            if(confirm("Sure?")){
                $.ajax({
                type: "get",
                url: "setEnable.php",
                data: "enable=1"
                });
            }else{
                $('#toggle').prop('checked',false);
            }
        } else {
            $.ajax({
                type: "get",
                url: "setEnable.php",
                data: "enable=0"
            });
        }
    }

如何将onclick事件绑定到更改事件的复选框INSTEAD？

2 个答案: