2017-03-21 9 views
2

私は自分のHTMLに複数の選択リストを持っています。値296が選択されると、他のすべてのオプションは選択解除されなければなりません。複数の選択、ある特定のオプションが選択されている場合、他のオプションの選択解除

これは私が、私は、私は複数のオプションを選択するときにCtrlキーを使用する必要はありません使用していますコードです:

$("#select").mousedown(function(e) { 
 
    e.preventDefault(); 
 

 
    var select = this; 
 
    var scroll = select.scrollTop; 
 

 
    if (select.value == 296) { 
 
    //unselect all the other options 
 
    } 
 

 
    e.target.selected = !e.target.selected; 
 

 
    setTimeout(function() { 
 
    select.scrollTop = scroll; 
 
    }, 0); 
 

 
    $(select).focus(); 
 
}).mousemove(function(e) { 
 
    e.preventDefault() 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="select" name="adrestype_id" class="form-control" required="required" multiple="multiple">     
 
    <option value="296">Primairadres </option>     
 
    <option value="297">Bezoekadres </option>     
 
    <option value="298">Factuuradres </option>     
 
    <option value="299">Postadres </option> 
 
</select>

私は方法を見つけ出すように見えることはできません値296を選択すると他のオプションはすべて選択解除できます

答えて

1

以下は、上記の状態を達成しているようです。 296が既に選択されている場合は、オプションの選択もやめます。

const unselect = '296' 
 

 
$('#select').change(function() { 
 
    const $el = $(this) 
 
    console.log($el.val()) 
 
    if ($el.val().indexOf(unselect) !== -1) { 
 
    $el.children('option').each(function() { 
 
     $opt = $(this) 
 
     if ($opt.val() !== unselect) { 
 
     $opt.prop('selected', false) 
 
     } 
 
    }); 
 
    } 
 
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="select" name="adrestype_id" class="form-control" required="required" multiple="multiple">     
 
      <option value="296">Primairadres </option>     
 
      <option value="297">Bezoekadres </option>     
 
      <option value="298">Factuuradres </option>     
 
      <option value="299">Postadres </option> 
 
     </select>

関連する問題