Javascript 删除选择中的选项

我想使-例如，如果我选择在第一个位置选项1，然后我其他人选择此选项应删除。 所以如果我在第一个选择中选择1，然后在第二个和第三个选择中，我只有选项2和3。如果在第二次选择中我选择2，那么在最后一次选择中我只有选项3

我怎样才能做到？我想使用jQuery

---

LIVE:

如果您对第二个和第三个select元素使用不同的类，那么这将很容易

<select class="one">
    <option></option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>
<br />
<select class="one">
    <option></option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>
<br />
<select class="one">
    <option></option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>

$(".one").change(function(){

})

编辑： 已更新代码以应用于多个选择。[感谢所有评论员和Alex的关注]

$(".one").change(function(){
    var val = parseInt($(this).val());
    $('.two,.three').find('option:contains('+val+')').remove();  
});  

---

如果您对第二个和第三个select元素使用不同的类，这将很容易

<select class="one">
    <option></option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>
<br />
<select class="one">
    <option></option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>
<br />
<select class="one">
    <option></option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>

$(".one").change(function(){

})

编辑： 已更新代码以应用于多个选择。[感谢所有评论员和Alex的关注]

$(".one").change(function(){
    var val = parseInt($(this).val());
    $('.two,.three').find('option:contains('+val+')').remove();  
});  

---

如果你需要排序一些东西，考虑使用一组像下拉菜单这样的东西来做一个非常差的UX。

但要回答你的问题：

变量$selects=$'.one'； $selects.onkeyup单击更改，函数E{ $selects.notthis.trigger'updateselection'； }.ONUPDATE选择、函数、数据{ var$this=$this； $this.children.show； $selects.notthis.eachfunction{ var值=$this.val； 如果值{ $this.children'[value='+value+']'。hide； } }; }; 1. 2. 3. 1. 2. 3. 1. 2. 3.

---

隐藏选项在当前firefox中有效。我不确定传统浏览器。隐藏，但不删除，元素确保你可以改变你的选择而不削弱你的输入元素。

如果你需要排序一些东西，考虑使用一些像下拉菜单这样的东西，使一个非常差的UX。 但要回答你的问题：

变量$selects=$'.one'； $selects.onkeyup单击更改，函数E{ $selects.notthis.trigger'updateselection'； }.ONUPDATE选择、函数、数据{ var$this=$this； $this.children.show； $selects.notthis.eachfunction{ var值=$this.val； 如果值{ $this.children'[value='+value+']'。hide； } }; }; 1. 2. 3. 1. 2. 3. 1. 2. 3. 隐藏选项在当前firefox中有效。我不确定传统浏览器。隐藏但不删除元素可以确保您可以更改选择，而不会破坏输入元素。

给您

当s的值更改时，只需获取此值并在其他s中搜索具有此值的s，然后将其删除

  $(".one").change(function(){
        var val = parseInt($(this).val());
        $(this).siblings().find('option:contains('+val+')').remove();  
    });  

给你

当s的值更改时，只需获取此值并在其他s中搜索具有此值的s，然后将其删除

  $(".one").change(function(){
        var val = parseInt($(this).val());
        $(this).siblings().find('option:contains('+val+')').remove();  
    });  

---

---

我有三个位置，我必须订购这个，所以如果我选择了一个选项，那么在其他选择中，这个选项应该被删除-这个选项在第一选择中，我不认为下拉列表是最好的界面。取决于你愿意做多少工作，为什么不把标有1-2-3的小盒子放在上面，让用户把它们拖到她想要的顺序中？@gdoron-什么，把它作为一个问题发布在上面，这样就不算努力了？@JaredFarrish。当然有+1.我有三个位置，我必须订购这个，所以如果我选择了一个选项，那么在其他选项中选择这个选项应该被删除-这个选项在first selected中，我不认为下拉列表是最好的界面。取决于你愿意做多少工作，为什么不把标有1-2-3的小盒子放在上面，让用户把它们拖到她想要的顺序中？@gdoron-什么，把它作为一个问题发布在上面，这样就不算努力了？@JaredFarrish。当然有+1.最后不是添加id答案。@JaredFarrish在这种情况下需要id做什么？有点被你的评论搞糊涂了：/你的答案是第一个不建议只添加一个id或更多类的答案。换句话说，您实际上使用的是jQuery的DOM遍历方法。因此，不需要id。当然，IE在某些版本（如果不是所有版本的话）中不支持隐藏/显示选项。因此，尽管解决方案看起来很简单，但它不兼容跨浏览器。实际上，它不是添加id答案。@JaredFarrish在这种情况下需要id做什么？有点被你的评论搞糊涂了：/你的答案是第一个不建议只添加一个id或更多类的答案。换句话说，您实际上使用的是jQuery的DOM遍历方法。因此，不需要，您不需要id。当然，IE不支持在某些（如果不是所有）版本中隐藏/显示选项。因此，尽管解决方案看起来很简单，但它不具有跨浏览器兼容性。我会使用$.sibles。请把你的代码也写在答案里。这是我的第一篇文章，谢谢你的建议，我现在就写。我能看到的唯一问题是，一旦选择被删除，它们就消失了。所以修改选择可能会带来麻烦。我觉得这也有点奇怪，但这正是@paul jeggor所要求的。我用一个重置按钮来显示隐藏的编辑：好的，注释中没有代码：我会使用$.sides。请把你的密码也写在答案里。这是我的第一篇帖子，谢谢你的建议

---

---

ce，我现在就做。我能看到的唯一问题是，一旦选择被删除，它们就消失了。所以修改选择可能会带来麻烦。我觉得这也有点奇怪，但这正是@paul jeggor所要求的。我用一个重置按钮来显示隐藏的s编辑：好，评论中没有代码：@PaulJeggor:我想你跳过了我答案的第一行。根据我的回答检查这个工作版本。@Somebodyisintrouble:我会很感激一些细节。@Ajinkya:我不是落选者。。但我认为你需要再次阅读这个问题。他希望在第一次选择之后的第二次选择中实现它。因此，如果有多个选择，你必须编写大量代码。。检查答案，您不需要添加class/id属性就可以在jQuery中工作。这就是为什么会有像$.sibles之类的DOM方法，所以您可以在没有太多规范的情况下进行遍历。一、.2和.3也不是很好的类名，因为它们并不暗示或描述意义或分组。@nandu:谢谢。我误解了这个问题。更新了答案。@PaulJeggor:我想你跳过了我答案的第一行。根据我的回答检查这个工作版本。@Somebodyisintrouble:我会很感激一些细节。@Ajinkya:我不是落选者。。但我认为你需要再次阅读这个问题。他希望在第一次选择之后的第二次选择中实现它。因此，如果有多个选择，你必须编写大量代码。。检查答案，您不需要添加class/id属性就可以在jQuery中工作。这就是为什么会有像$.sibles之类的DOM方法，所以您可以在没有太多规范的情况下进行遍历。一、.2和.3也不是很好的类名，因为它们并不暗示或描述意义或分组。@nandu:谢谢。我误解了这个问题。已经更新了答案。只是回答中的一个小问题。你用了什么？隐藏和不隐藏。移除？？有什么特别的原因吗？因为移除元素后，没有简单的方法返回。正如OP所说，在系列中选择1、2、3不应该只是删除所有选项，而应该是回答中的一个小问题。你用了什么？隐藏和不隐藏。移除？？有什么特别的原因吗？因为移除元素后，没有简单的方法返回。正如OP所说，选择1、2、3系列不应该只是删除所有选项。