显示基于其他选择选项的选择选项答案

【问题标题】：Display a select option based on other select option显示基于其他选择选项的选择选项
【发布时间】：2015-02-09 23:27:17
【问题描述】：

<select name = "team1">
  <option>Computer Science</option>
  <option>Mathematics</option>
  <option>Bioinformatic</option>
  <option>Management Sciences</option>
</select>
<select name = "team2">
  <option>Computer Science</option>
  <option>Mathematics</option>
  <option>Bioinformatic</option>
  <option>Management Sciences</option>
</select>

我如何使用上面的代码，因为“team2”取决于“team1”的值。如果我在团队 1 的选择选项中选择计算机科学，那么我不希望计算机科学出现在选项中“团队2”。

【问题讨论】：

欢迎来到 Stack Overflow！这个问题的信息有点少。你能分享一下你尝试过的东西，你遇到了什么问题吗？请阅读How to ask questions on StackOverflow

标签： php html ajax

【解决方案1】：

您可以为您的选择提供一个 ID 并检查特定元素的选择。因此，您可以区分 team1 和 team2 并在 team2-selection 中删除一些具有相同值的内容。可能是这样的：

<body>
 <select onChange="jsFunction()" id="team1" >
      <option onclick="jsFunction()">Computer Science</option>
      <option>Mathematics</option>
      <option>Bioinformatic</option>
      <option>Management Sciences</option>
    </select>

    <select id="team2">
      <option>Computer Science</option>
      <option>Mathematics</option>
      <option>Bioinformatic</option>
      <option>Management Sciences</option>
    </select>

    <script>
    function jsFunction(){
        var team1 = document.getElementById( "team1" );
        var team2 = document.getElementById( "team2" );
        for (i=0;i<4;i++){
            team2.remove(0);
        }
        var position=0;
        for (i=0;i<4;i++){
            if (i!=team1.selectedIndex){
            team2.options[position] = new Option(team1.options[i].value);
            position=position+1;
            }
        }

    }
    </script>
        </body>

【讨论】：

您可以在此处找到解决方案：stackoverflow.com/questions/3301688/… 和此处stackoverflow.com/questions/1085801/…
我把它写成
您必须在定义选择之后将脚本部分添加到正文中。我编辑了我的帖子
现在它只适用于第一个选项，只有计算机科学选项没有显示在“team2”中，我应该使用 AJAX 来完成它而不提交表单吗？如果是，那么请给我一个提示吗？
您不需要任何 AJAX 或 PHP。我再次编辑了我的帖子，以便在 team1 的选择发生变化时立即调整 team2 的值。

【解决方案2】：

您可以将复选框用于这些选项。它可以解决您的问题。

【讨论】：

但我想在选择选项中使用它，

【解决方案3】：

为什么选择 PHP？

http://jsfiddle.net/655noe6p/

HTML：

<select name = "team1">
</select>
<select name = "team2">
</select>

JS：

var l = [
    'Computer Science',
    'Mathematics',
    'Bioinformatic',
    'Management Sciences'
];

$('select').change(function() {
    var me = $(this);
    var other = me.siblings();

    var text = me.children(':selected').text();

    other.each(function() {
        var select = $(this);

        var currentText = select.children(':selected').text();
        select.empty();
        $.each(l, function(k, d) {
            if(d != text) {
                select.append($('<option></option>').html(d).attr('selected', d == currentText));
            }
        });
    });
});

$('select').change().change();

【讨论】：

选择后JS会在body标签中吗？
在
如何包含jquery？
很抱歉又打扰你了，我其实对j查询和java脚本不太熟悉，但是我会用一点。
你能谷歌一下如何包含 jquery。你真好。你会发现比我在这里能告诉你的更多。