如何从javascript中的多个输入字段读取值?

时间:2014-08-17 18:51:34

标签: javascript jquery html input append

感谢您事先调查此事。这基本上是我第一周的javascript,所以如果这是常见的事情我会道歉并且我很欣赏指向类似问题的链接。

我无法弄清楚如何同时从我的下拉列表和文本输入中提取值,以便我可以将该信息附加到另一个容器中。这是我的HTML:

<div class=“container1”>
   <select class=“options_selector”>
     <option val=“admin”>admin</option>
     <option val=“user”>user</option>
   </select>
   <input class=“user_name” type="text"/>
</div>

<div class=“container2”>
   <!— append stuff here —>
</div>

所以来自container1的信息应该附加到container2。例如,如果我在options_selector中选择'admin'并在user_name输入框中键入'freddy',那么container2现在应该包含'admin freddy'。那么,当我将选择框值更改为'user'并且将输入文本更改为'john'时 - container2应该有另一段文本附加'user john'。

我知道可以通过改变事件来完成,但我无法弄清楚将这两部分信息一起提取出来的一般想法。

顺便说一句,我正在使用jquery作为框架。

提前谢谢。

1 个答案:

答案 0 :(得分:0)

您可以编写如下代码:

$( "select" ).change(function () {
var str = "";
$( "select option:selected" ).each(function() {
str += $( this ).text() + " ";
});
$( "#user_name" ).val(str);
}).change();

JSFiddle Here!