Question

我有多个复选框。用户可以选择一个或多个。所以，我必须得到那些复选框的值。

 <div class="filters col-md-12">
                        <div class="form-group">
                            @foreach($destination as $dest)
                            <label class="radio-inline" id="desti">{{$dest->destination}}
                                <input  type="checkbox" name="dest_val" value="{{$dest->id}}">
                                <span class="checkmark"></span>
                            </label>
                            @endforeach
                        </div>
                    </div>

顺便说一下，我正在使用Laravel.So，在Jquery中，我写的是：

   $(document).on('click','#desti',function () {

           var destination = $("input[name='dest_val']:checked").val()
               console.log(destination);


       });

但是，它没有给我正确的价值观。当我点击第一个复选框时，它给出值= 1，这是正确的，当我点击2时，它给出2这是正确的。因此，当检查1并且我检查2然后，我得到两个一个添加到前一个1，这使得1（3）/ 1次3并且我也得到1两个。所以，我想要的是当我检查2时我只得到2而不再是2。

这种事情也反过来发生了。有人可以帮忙吗？

Answer 1

你不能在DOM元素上重用id属性而不会得到像这样的奇怪结果。尝试为每个复选框或类名使用唯一ID。

您还希望给复选框一个唯一的名称。

以下是使用班级名称的示例：

<强> HTML

<div class="filters col-md-12">
    <div class="form-group">
        @foreach($destination as $dest)
            <label class="radio-inline checkbox-label">{{$dest->destination}}
                <input type="checkbox" value="{{$dest->id}}">
                <span class="checkmark"></span>
            </label>
       @endforeach
    </div>
</div>

<强> JS

$(document).on('click','.checkbox-label',function () {
    var destination = $(this).find('input[type="checkbox"]').val();
    console.log(destination);
});

使用Jquery获取复选框值

1 个答案: