Question

我有这段代码

  <link href="https://gitcdn.github.io/bootstrap-toggle/2.2.0/css/bootstrap-toggle.min.css" rel="stylesheet">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <script src="https://gitcdn.github.io/bootstrap-toggle/2.2.0/js/bootstrap-toggle.min.js"></script>
  <script>
    $('#toggle-two').bootstrapToggle({
      on: 'Enabled',
      off: 'Disabled'
    });
    $('[name="place[]"]').change(function() {
      console.log(this.value)
    })
  </script>
  <input type="checkbox" name="place[]" value="USA" checked data-toggle="toggle" data-size="mini" data-onstyle="primary" data-offstyle="danger" data-on="Enabled" data-off="Disabled">
  <input type="checkbox" name="place[]" value="Canada" data-toggle="toggle" data-size="mini" data-onstyle="primary" data-offstyle="danger" data-on="Enabled" data-off="Disabled">
  <input type="checkbox" name="place[]" value="Japan" checked data-toggle="toggle" data-size="mini" data-onstyle="primary" data-offstyle="danger" data-on="Enabled" data-off="Disabled">
  <input type="checkbox" name="place[]" value="Russia" data-toggle="toggle" data-size="mini" data-onstyle="primary" data-offstyle="danger" data-on="Enabled" data-off="Disabled">

我希望在单击复选框后获取值，无论是否已选中。

显示上面的代码，它不起作用。我正在使用bootstrap-toggle。

请帮忙。谢谢:)）

Answer 1

将您的脚本写在$(document).ready()内，如下所示

<script>
$(document).ready(function(){
    $('#toggle-two').bootstrapToggle({
        on: 'Enabled',
        off: 'Disabled'
    });
    $('[name="place[]"]').change(function() {
        console.log(this.value)
    })
});
</script>

Answer 2

就像这样..

$('[name="place[]"]').change(function(){
    if($(this).prop("checked") == true){
       //checked
    }else{
       //not checked
    }
});

Bootstrap Checkbox Toggle - 单击后如何获取复选框的值

2 个答案: