如何将onclick事件绑定到INSTEAD更改事件的复选框？(How can I bind a onclick event to a checkbox INSTEAD of a change eve

如何将onclick事件绑定到INSTEAD更改事件的复选框？(How can I bind a onclick event to a checkbox INSTEAD of a change event?)

这是我的问题。

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

这是我到目前为止（它不能正常工作，没有发送到数据库，点击时不点击用户点击复选框）

$(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（'click'，func（）{}）事件时，什么都不会触发。 我认为它不适用于复选框？ 我究竟做错了什么？

Here is the problem I have.

I'm making a control panel for some devices. Now the user can enable/toggle an on/off switch (checkbox) and so can a remote device. This is reflected in the database. However, I also want a confirm box whenever the user (NOT the device) toggles to enable the device (checkbox == checked). No confirmation box required for when the user disables (toggles off, checkbox==false) the device. I check the database every few seconds to see the state of device (since the device can turn itself on or off)

This is what I have so far (It doesn't work correctly. Nothing is sent to the database. on click doeesn't fire on user click in checkbox)

$(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" }); } }) }) })

How can I do this? When I try to register the on('click',func(){}) event, nothing fires. I assume it doesn't work for checkboxes? What am I doing wrong?

最满意答案

你在另一个事件中绑定一个事件..

$('#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" }); } }

You're binding an event within another event..

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

You should only bind once, like this...

$('#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" }); } }