如何用JQ实现三个下拉框互斥选择？

本文共计411个文字，预计阅读时间需要2分钟。

三個下拉選單內容相同，當選擇其中一個選項後，隱藏其他兩個下拉選單中相同的選項。

1. [代碼]JavaScript 選擇帳號 帳號1 帳號2 帳號3 帳號1 帳號2 帳號3 帳號1 帳號2 帳號3

三个select下拉框中的内容相同，当其中一个下拉框选中了其中一个值后，隐藏掉另外两个下拉框中相同的值。

1.[代码][JavaScript]代码

<div class="selectaccount"> <h4 class="page_title"><?php echo Yii::t('manager', 'Select Accounts'); ?></h4> <select> <option value='select1'><?php echo Yii::t('manager', 'Select') ?></option> <?php foreach ($accounts as $key => $account) : ?> <option value='<?php echo $account['id']; ?>'><?php echo $account['name']; ?></option> <?php endforeach; ?> </select> <select> <option value='select2'><?php echo Yii::t('manager', 'Select') ?></option> <?php foreach ($accounts as $key => $account) : ?> <option value='<?php echo $account['id']; ?>'><?php echo $account['name']; ?></option> <?php endforeach; ?> </select> <select> <option value='select3'><?php echo Yii::t('manager', 'Select') ?></option> <?php foreach ($accounts as $key => $account) : ?> <option value='<?php echo $account['id']; ?>'><?php echo $account['name']; ?></option> <?php endforeach; ?> </select> <button class="btn" id="compare"><?php echo Yii::t('master', 'Compare'); ?></button> </div> <script> //下拉框联动互斥 $('.selectaccount select').change(function () { var strchecked = new Array(); $('.selectaccount select').each(function () { strchecked[$(this).index()] = $(this).val(); }); //console.log(strchecked); $(this).siblings().find('option').each(function () { if (($(this).attr('value') == strchecked[0] || $(this).attr('value') == strchecked[1] || $(this).attr('value') == strchecked[2]) && ($(this).index() != 0 && $(this).attr('value') != $(this).parents('select').val())) { $(this).hide(); } else { $(this).show(); } }); }); </script>