删除从另一个下拉菜单中选择的下拉列表值 [英] Remove a dropdown value that has been selected from another dropdown menu

问题描述

我在网上搜索了一段时间但仍无法找到答案，我的网站上有三个下拉菜单。

I have searching the web for a while and still I cant find an answer, I have three drop-down menus on my site.

我用它们来接受用户首选项，以便用户可以控制结果的输出。

I use them for accepting user preferences so the user can control the output of results.

所以我想知道，如果选择了其他2个下拉列表，是否可以取消该值一个。

So I want to know if its possible for the value to be taken out of the other 2 dropdowns if its selected in one.

例如，如果用户选择第一个中的电影而不是其他电影。

这是我的下拉列表

<select id="pref1select">
<option value="P">Preference One</option>
    <option value="M">Movie</option>
    <option value="T">Tv</option>
    <option value="G">Games</option>
</select>
<select id="pref2select">
<option value="P">Preference Two</option>
    <option value="M">Movie</option>
    <option value="T">Tv</option>
    <option value="G">Games</option>
</select>
<select id="pref3select">
<option value="P">Preference Three</option>
    <option value="M">Movie</option>
    <option value="T">Tv</option>
    <option value="G">Games</option>
</select>

推荐答案

这将禁用它，但不会将其删除。< br>
小提琴： http://jsfiddle.net/p2SFA/1/

This will disable it, but not remove it.
Fiddle: http://jsfiddle.net/p2SFA/1/

HTML :(已添加 .preferenceSelect 类）

HTML: (Added .preferenceSelect class)

<select id="pref1select" class="preferenceSelect">
    <option value="P">Preference One</option>
    <option value="M">Movie</option>
    <option value="T">Tv</option>
    <option value="G">Games</option>
</select>
<select id="pref2select" class="preferenceSelect">
    <option value="P">Preference Two</option>
    <option value="M">Movie</option>
    <option value="T">Tv</option>
    <option value="G">Games</option>
</select>
<select id="pref3select" class="preferenceSelect">
    <option value="P">Preference Three</option>
    <option value="M">Movie</option>
    <option value="T">Tv</option>
    <option value="G">Games</option>
</select>

jQuery：

$(document).ready(function() {
    $(".preferenceSelect").change(function() {
        // Get the selected value
        var selected = $("option:selected", $(this)).val();
        // Get the ID of this element
        var thisID = $(this).prop("id");
        // Reset so all values are showing:
        $(".preferenceSelect option").each(function() {
            $(this).prop("disabled", false);
        });
        $(".preferenceSelect").each(function() {
            if ($(this).prop("id") != thisID) {
                $("option[value='" + selected + "']", $(this)).prop("disabled", true);
            }
        });

    });
});

---

如果你想删除它，你可能会有让jQuery知道在重置时要插入什么，因为做出了新的选择：）

---

If you want it removed, you will probably have to make jQuery know what to insert when it has reset because a new choice is made :)

这篇关于删除从另一个下拉菜单中选择的下拉列表值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！