Question

是的，标题是一团糟。

这是我正在尝试做的事情：我有一个主要的下拉列表，我可以在两个选项之间进行选择。选项1和选项2。如果选择了Option1，我不希望发生任何事情。如果选择了Option2，我想从另一个下拉列表中删除一个option-tag。

<select name="main_dropdown">
    <option value="Option1">Option 1</option>
    <option value="Option2">Option 2</option>
</select>

<select name="secondary_dropdown">
    <option value="Option1">Option 1</option>
    <option value="Option2">Option 2</option> // Let's say i want to remove this option tag if Option2 in main_dropdown is selected.
    <option value="Option2">Option 2</option>
</select>

谢谢！

Answer 1

如果您的问题包括展示您自己尝试找到答案的代码，而不是要求其他人编写您需要的代码，我认为您会得到更好的回复和更多关注。不只是因为人们不想让他们做自由工作，而且回答起来也变得更加困难。

例如，尽管您尝试做的是非常基本的javascript，但有几种不同的方法可以解决它。这是一个快速解决你的问题的答案（使用jQuery）：

<script>
  $(document).ready(function(){
    $('select[name=main_dropdown]').bind('change',function(){
      if($(this).val() == 'Option2') $('select[name=secondary_dropdown] option[value=Option2]').remove();
    });   
  });
</script>

<select name="main_dropdown">
    <option value="Option1">Option 1</option>
    <option value="Option2">Option 2</option>
</select>

<select name="secondary_dropdown">
    <option value="Option1">Option 1</option>
    <option value="Option2">Option 2</option> // Let's say i want to remove this option tag if Option2 in main_dropdown is selected.
    <option value="Option2">Option 2</option>
</select>

See it in action.

也就是说，这种解决方案非常脆弱。在这种情况下它会做你想要的，但如果你的关系发生变化，或者代码变得更复杂等，这不是一个很好的解决方案。等等没有示例代码，就不可能告诉你什么标准了'用来定位选项并删除它们，所以你不可能做得很好。

我建议从jQuery库开始，该库有一些很棒的Tutorials。如果你试一试，你应该可以很快自己解决这类问题。如果您的代码最终无法正常工作且您不知道该转向何处，请不要担心 - 我相信此处的人会很乐意帮助您。

Answer 2

<option value="Option2" id="ToBeOrNotToBe">Option 2</option>

如果'main_dropdown'的值为“Option2”（进行比较），请使用.removeChild（）从“secondary_dropdown”中删除document.getElementById（“ToBeOrNotToBe”）。我建议给你的所有选择一个唯一的id和名称，这样你就可以使用document.getElementById（）来获取你的元素，然后使用.removeChild（）来操作所有内容。您传递给removeChild（）的参数将是您的选项2。

但是，removeChild（）返回它删除的对象，因此将其存储到另一个变量中，因此如果用户通过主下拉列表改变主意，则将已删除的option2作为子项追溯到“secondary_dropdown”。 / p>

另外，在我看来，首先构建主下拉列表，一旦他们选择了一个值，然后使用appendChild（）将第二个下拉列表构建到文档本身。如果你看，http://www.w3schools.com/tags/tag_option.asp显示你可以附加到选项的事件监听器，所以一旦选择了一个选项，在第一个下面插入第二个下拉列表，并相应地构建它。

如果您只想要一个快速而简单的解决方案，请在选择主下拉列表中的选项时使用事件监听器激活，然后删除选项2或相应地添加它。

Javascript：从下拉列表中删除不同的选项标签，具体取决于另一个下拉列表？

2 个答案: