将下拉框选择附加到文本框

时间:2018-04-30 18:58:47

标签: javascript php jquery html jsfiddle

我想知道是否有人能指出我正在寻找的方向... 基本上,我希望有3-5个下拉框(可能还有2个文本框),每个框都有自己的特定选项。然后,我想在按下按钮后将所选选项附加到文本框中的文本字符串中(或称为excel将其称为CON​​CATENATE)(称之为生成)。我可以定义文本字符串以及选项所在的位置。

原油示例;

选择

下拉1 - 下拉2 - 下拉3 - 文本框1 - 文本框2

文本框中的输出:

选择1 - 选择2 - 选择3 - 可选文本 - 可选文本

如果有人知道一个最适合我需要的例子,那将是非常棒的,所以我可以想出来......我还没有遇到过。

1 个答案:

答案 0 :(得分:2)

要实现这一点,您必须创建一个收集所有值的函数,然后按照您希望的方式对它们进行格式化。

这方面的一个例子是:



function generate(){
    var result = '';

    result += document.getElementById('drop1').value + ' - ';
    result += document.getElementById('drop2').value + ' - ';
    result += document.getElementById('drop3').value + ' - ';
    result += document.getElementById('text1').value + ' - ';
    result += document.getElementById('text2').value;

	document.getElementById('output').innerHTML = result;
}
generate();

<select id="drop1" onchange="generate()">
    <option value="d1s1">D1 S1</option>
    <option value="d1s2">D1 S2</option>
</select>
<select id="drop2" onchange="generate()">
    <option value="d2s1">D2 S1</option>
    <option value="d2s2">D2 S2</option>
</select>
<select id="drop3" onchange="generate()">
    <option value="d3s1">D3 S1</option>
    <option value="d3s2">D3 S2</option>
</select>
<input id="text1" type="text" value="text1" onchange="generate()" onkeyup="generate()" />
<input id="text2" type="text" value="text2" onchange="generate()" onkeyup="generate()" />

<p id="output"></p>
&#13;
&#13;
&#13;