Question

我的问题是如何将选定的答案从下拉列表中转移到另一个下拉列表中？如何对A组和B组进行编程？请参阅下面的代码。

示例：

如果某人从A组和B组中选择，我想要选择回答de下拉列表A组和B组。

<!DOCTYPE html>
<html>
<body>

<select name="GROUD A">
<option value="Select">Group A</option>
<option value="A1">A1</option>
<option value="A2">A2</option>
<option value="A3">A3</option>
<option value="A4">A4</option>
</select>
<p></P>


<select name="GROUD B">
<option value="Select">Group B</option>
<option value="B1">B1</option>
<option value="B2">B2</option>
<option value="B3">B3</option>
<option value="B4">B4</option>
</select>

<select name="GROUP A&B">
<option value="Select">Selection from Group A and B</option>
<option value="A?">A?</option>
<option value="B?">B?</option>
</select>

</body>
</html>

Answer 1

纯JavaScript解决方案：

检查小提琴：

<强> http://jsfiddle.net/q6rV9/3/

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript">
        function groupA(val) {  
            var x = document.getElementById("groupAB");
            x.options[1].value = val;
            x.options[1].text = val;
            x.options[1].selected="true";
        }

        function groupB(val) {  
            var x = document.getElementById("groupAB");
            x.options[2].value = val;
            x.options[2].text = val;
            x.options[2].selected="true";
        }
    </script>
</head>
<body>
<form>
    <select name="groupa" onchange="groupA(this.value)">
        <option value="A?">Group A</option>
        <option value="A1">A1</option>
        <option value="A2">A2</option>
        <option value="A3">A3</option>
        <option value="A4">A4</option>
    </select>
    <p></p>
    <select name="groupb" onchange="groupB(this.value)">
        <option value="B?">Group B</option>
        <option value="B1">B1</option>
        <option value="B2">B2</option>
        <option value="B3">B3</option>
        <option value="B4">B4</option>
    </select>
    <select name="groupab" id="groupAB">
        <option value="Select">select</option>
        <option value="">A?</option>
        <option value="">B?</option>
    </select>
</form>
</body>
</html>

Answer 2

尝试这样做 -

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
 $(document).ready(function(){
    var str='<select name="answers">';
    $('select').each(function(){

        str+='<option>'+$(this).find('option:selected').text()+'</option>';    
    });

    str+='</select>';
    $('#anwer').html(str);

    });
    </script>
</head>
<body>

<select name="GROUD A">
<option value="Select">Group A</option>
<option value="A1">A1</option>
<option value="A2">A2</option>
<option value="A3">A3</option>
<option value="A4">A4</option>
</select>
<p></P>


<select name="GROUD B">
<option value="Select">Group B</option>
<option value="B1">B1</option>
<option value="B2">B2</option>
<option value="B3">B3</option>
<option value="B4">B4</option>
</select>

<select name="GROUP A&B">
<option value="Select">Selection from Group A and B</option>
<option value="A?">A?</option>
<option value="B?">B?</option>
</select>

<p>
    <div id="anwer"></div>
</p>
</body>
</html>

如何从另一个下拉列表中的下拉列表中获取值？

2 个答案: