Question

我有3个HTML字段：一个文本框和两个选择列表。我要做的是让用户在文本字段中输入内容并从其他两个列表中选择选项，然后单击“添加”按钮，将其总选择添加到另一个列表中。最终列表是CGI脚本提交和接收的列表。

例如，用户输入“Toyota”并从一个列表中选择Sedan，从第二个列表中选择2004并单击添加。然后，“丰田轿车2004”将被添加到一个空列表中。用户可以向列表添加多个选择或从列表中删除。此列表是提交表单时提交的列表。我最好只在Javascript中这样做，所以没有JQuery。有人能指出我正确的方向吗？

Answer 1

你需要的是，当点击“添加”按钮时，会调用一个简单的javascript函数来检索：text，selection1＆amp; selection2 =＆gt;使用这些信息构建一个新选项，将其附加到结果列表中。

关键的javascript函数：

- document.getElementById
- document.createElement
- appendChild

在您的html中，表单/提交按钮必须仅在您的结果列表周围。

示例（jsfiddle link）：

<html>
    <head>
        <script>
            function add() {
                var txt = document.getElementById("txt").value;
                var sel1 = document.getElementById("sel1").value;
                var sel2 = document.getElementById("sel2").value;
                var result = txt + " " + sel1 + " " + sel2;

                var resultOption = document.createElement("option");
                resultOption.value = result;
                resultOption.text = result;
                document.getElementById("selResult").appendChild(resultOption);
            }
        </script>
    </head>
    <body>
        <input id="txt" type="text" />
        <select id="sel1">
            <option value="value11">value11</option>
            <option value="value12">value12</option>
            <option value="value13">value13</option>
        </select>
        <select id="sel2">
            <option value="value21">value21</option>
            <option value="value22">value22</option>
            <option value="value23">value23</option>
        </select>
        <input type="button" value="add" onClick="javascript:add()"/>
        <br/>
        result:
        <form action ="." method="post">
            <select id="selResult"></select>
            <input type="submit" value="submit"/>
        </form>
    </body>
</html>

Answer 2

使用需要使用此jquery插件：

Jquery Forms
Jquery Auto Tab
Jquery UI

一些对你有用的jquery函数：

从多个HTML字段中选择，然后将总计添加到另一个列表

2 个答案: