删除从另一个下拉菜单中选择的下拉列表

我在网上搜索了一段时间，但仍无法找到答案，我的网站上有三个下拉菜单。删除从另一个下拉菜单中选择的下拉列表

我使用它们来接受用户偏好，以便用户可以控制结果的输出。

所以我想知道如果它的值可以从其他2个下拉列表中选出来，

例如，如果用户选择第一个中的电影，它将不会在其他电影中。

这里是我的下拉菜单

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

来源

2014-04-27 Jamiex304

这将禁用它，但无法将其删除。
小提琴：http://jsfiddle.net/p2SFA/1/

HTML：（由.preferenceSelect类）

<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知道什么插入时，它已经关注计算负担，因为一个新的选择是由:)

来源

2014-04-27 01:41:54

你不应该在这种情况下使用'attr'：http://stackoverflow.com/questions/5874652/prop-vs-attr – Chase

哦！我在这里学习了很多新东西。 –

我们都= =）只是想我会指出来，所以你知道，看起来像你照顾它。 – Chase

我相信这样的事情会做给上面的HTML的伎俩：

var $selects = $("select"); 

$selects.on("change", function(){ 
    var value = this.value; 

    $("option[value='" + value +"']", $selects).prop("disabled", true);  
});

这显然禁止复制选项，但它是一个简单的变化也删除它们。尽管你会遇到一个小问题，因为“首选项＃”选项都具有相同的值。我会建议制作这些optgroup标签或完全删除这些值并将它们从一开始标记为禁用，因为您应该无法首先单击它们。你可以找到更多的选项标签和分隔符回答here。

Example

来源

2014-04-27 01:36:23 Chase

你应该试试这个：

$(".preferenceSelect").on("change", function() { 
      $(".preferenceSelect option").prop("disabled", false); 
      var selectPref = $("option:selected", $(this)).val(); 
      var selectId = $(this).prop("id"); 
      $(".preferenceSelect option").each(function() { 
       $(this).show(); 
      }); 
      $(".preferenceSelect").each(function() { 
       if ($(this).prop("id") != selectId) { 
        $("option[value='" + selectPref + "']", $(this)).prop("disabled", true); 
       } 
      }); 

     });

这必须是你的工作。

来源

2014-04-27 06:50:04

did not work sorry – Jamiex304

这应该为你工作：

$(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).attr("id"); 
     // Reset so all values are showing: 
     $(".preferenceSelect option").each(function() { 
      $(this).show(); 
     }); 
     $(".preferenceSelect").each(function() { 
      if ($(this).attr("id") != thisID) { 
       $("option[value='" + selected + "']", $(this)).hide(); 
      } 
     }); 
    }); 
});`

来源

2015-06-26 13:09:37 Adit

删除从另一个下拉菜单中选择的下拉列表

回答

相关问题