引导程序切换单击并显示数据3次时出错

时间:2017-05-19 03:43:04

标签: javascript jquery html twitter-bootstrap

我在bootstrap toogle中遇到一些错误,当我点击切换它看起来不错但是如果在控制台日志切换中显示就像点击3次一样。我尝试使用http.get组合切换。我的代码就像这样

<input id="toggle-two" type="checkbox" data-toggle="toggle" data-width="100">
        <script>
                    $(function() {
                       $('#toggle-two').bootstrapToggle({
                         on: 'Lock',
                         off: 'Unlock'
                         })
                       .on('change', function() {
                         var Checked_or_not = this.checked,
                             tN = Checked_or_not ? 'rlock' : 'runlock';
                         $.ajax({ 
                             url: 'http://localhost/web.php?tN='+ tN +'&f00=123456789',
                             data: { checked:  Checked_or_not },
                             success: function() {
                                        console.log(tN);
                                      }
                          });
                       });
                    });
                  </script>

当我单击切换一次但显示数据3次

时,这是控制台日志
runlock
rlock
rlock

我不知道如何解决它,请帮我解决我的问题 感谢

1 个答案:

答案 0 :(得分:1)

&#13;
&#13;
                    $(function() {
                       $('#toggle-two').bootstrapToggle({
                         on: 'Lock',
                         off: 'Unlock'
                         })
                       .on('change', function() {
                         var Checked_or_not = this.checked,
                             tN = Checked_or_not ? 'rlock' : 'runlock';
                         $.ajax({ 
                             url: 'https://getbootstrap.com/?tN='+ tN +'&f00=123456789',
                             data: { checked:  Checked_or_not },
                             success: function() {
                                        console.log(tN);
                                      },
                                      always:function(){
                                       console.log(tN);
                                      }
                          });
                       });
                    });
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://gitcdn.github.io/bootstrap-toggle/2.2.2/css/bootstrap-toggle.min.css" rel="stylesheet"/>
<script src="https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js"></script>

<input id="toggle-two" type="checkbox" data-toggle="toggle" data-width="100">
&#13;
&#13;
&#13;

我小心翼翼地尝试这个代码。没有问题。