使用Jquery和ajax的Bootstrap开关切换function

我在我的应用程序中使用bootstrap开关如下：

每次点击开关时，我都会使用jquery代码来获取交换机的当前状态。 我使用的代码是：

 $(document).on('click', '#switch_toggle', function(event) { val = $('#switch-state').bootstrapSwitch('state'); console.log('current state : ' + val); $.ajax({ url: "${rc.getContextPath()}/module/site-settings/update-title-display", type: "POST", data: { showTitle: 10, siteId : 1, }, dataType: "html", success: function(htmlData) { aler("Success")) }, error: function(xhr, status, errorThrown) { console.log("Error: " + errorThrown); console.log("Status: " + status); console.dir(xhr); }, complete: function(xhr, status) {}, }); }); 

现在我面临两个问题

1.我想要的是一个只有在单击按钮并且其状态被切换时才被调用的函数。 但是每次单击封闭div时，我使用的当前函数都会被触发。

2.我无法将正确的布尔值传递给我的方法。 我试图发送交换机的状态，但我只能在我的控制器类中获取false值。

有什么办法可以解决这些问题吗？

Answer 1

bootstrap-switch – v3.3.2

这个答案包括如何捕获switchChange事件，并根据AJAX响应调用AJAX和管理开关状态。

HTML：

 /> 

jQuery的：

 $(document).ready(function() { $('.btn_changepermission').bootstrapSwitch({size : 'small'}); var stopchange = false; $('.btn_changepermission').on('switchChange.bootstrapSwitch', function (e, state) { var obj = $(this); if(stopchange === false){ $.ajax({ url: "/admin/ajax/permission/activate", dataType: 'json', type: "POST", quietMillis: 100, data: { auid: $(this).data('auid'), }, success: function(result) { if(result['done'] == true) { alert('Permission changed successfully.'); } else { alert('Error:'+result['message']); if(stopchange === false){ stopchange = true; obj.bootstrapSwitch('toggleState'); stopchange = false; } } }, error: function(result) { alert('Error! Unable to find this agentuser.'); if(stopchange === false){ stopchange = true; obj.bootstrapSwitch('toggleState'); stopchange = false; } } }); } }); }); 

使用外部变量（stopChange）来停止循环switchChange