html選擇標記從已選中的複選框更改

如何在複選框中選中某個選項時顯示選擇標記中顯示的標籤？ html選擇標記從已選中的複選框更改

複選框輸入

<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產品

  $(".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)) 
 
      });

來源

2017-04-12 Arturs Jerjomins

在選擇選項的變化意味着在複選框中的那些相關選項將被檢查嗎？ – rahulsm

選項和相應複選框之間的連接是什麼？ –

@rahul_m是的，我希望從選中的複選框中實時選擇選項顯示，無需刷新。 –

試試這個示例代碼，你可以用你自己的方式使用它。

$(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如果複選框值在下拉值中選擇進行檢查。

來源

2017-04-12 08:53:10 rahulsm

html選擇標記從已選中的複選框更改

回答

相關問題