当在复选框中选中某个选项时,该标签显示在选择标签中,我该怎么办?
复选框输入
<input
type="checkbox"
class="toggle-product pull-right" @if(!isset($restrictedProductIds[$p->id])) checked
@endif
data-url="{{route('image.settings.product.toggle',[$account,$album,$image,$p])}}">
选择标签
<select name="default_id" id="default_id" class="form-control">
<option value="{{$image->default_product_id}}" selected>{{$image->default_product_id}}</option>
@foreach($validProducts as $product)
@if(!isset($restrictedProductIds[$product->id]))
<option value="{{$product->id}}">
{{$product->getTranslatedName()}}
</option>
@endif
@endforeach
</select>
类.toggle-product
$(".toggle-product").on('click', function () {
var checked = $(this).is(':checked');
var $status = $(this).parents(".list-group-item");
$status.addClass('list-group-item-warning');
$.post($(this).data('url'), {
'enabled': checked ? 1 : 0,
'_token': "{{csrf_token()}}"
}, function (response) {
$status.removeClass('list-group-item-warning');
//location.reload();
}.bind(this))
});
最佳答案
尝试一下这个示例代码,您可以按照自己的方式使用它。
$(document).ready(function() {
$(document).on("change", "#select-ele", function() {
var cur_val = $(this).val();
$("[name='check-ele']").attr("checked", false);
if (cur_val.length > 0) {
$("[name='check-ele']").each(function() {
var check_val = $(this).val();
if ($.inArray(check_val, cur_val) > -1) {
$(this).attr("checked", true);
}
});
}
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<select id="select-ele" multiple>
<option value="1">Canvas</option>
<option value="2">Acrylic</option>
<option value="3">Cushion</option>
<option value="4">Mug</option>
</select>
<br/>
<input type="checkbox" name="check-ele" value="1">Canvas
<input type="checkbox" name="check-ele" value="2">Acrylic
<input type="checkbox" name="check-ele" value="3">Cushion
<input type="checkbox" name="check-ele" value="4">Mug
我用过$.inArray检查是否在下拉值中选择了复选框值。
关于javascript - html 选择标记从选中的复选框更改,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43363365/