javascript - jQuery:从多个字段中获取值并显示在文本字段中

Question

我有 6 个不同的选择框和一个文本字段，我需要使用 jQuery 从中获取值并合并到一个文本字段中。

我基本上理解我将使用这样的字符串为 targetTextField 构建值:$('#targetTextField').val(opt1+opt2+opt3+opt4+opt5+opt6+textField);

我用什么来获取 select#options1 的值并将其转换为 opt1？

它会遵循 opt1 = $('select#options1').val(); 还是我的方向完全错误？

我创建了一个只有两个选项的基本 jsfiddle:

http://jsfiddle.net/e2ScF/2/

jQuery

$(function() {
    $("#options").change(function(){
    var opt1 = $('select#options').val()
    }$('#targetTextField').val(opt1+opt2);
});
    $("#options2").change(function(){
    var opt2 = $('select#options2').val()
    }$('#targetTextField').val(opt1+opt2);
});
});​

HTML

<select id="options">
  <option value="" selected>Choose...</option>
  <option value="opt1Value1" >Option 1</option>
  <option value="opt1Value2" >Option 2</option>
</select>
<select id="options2">
  <option value="" selected>Choose...</option>
  <option value="opt2Value1" >Option 1</option>
  <option value="opt2Value2" >Option 2</option>
</select>
<input type="text" id="targetTextField" name="targetTextField" size="31" tabindex="0" maxlength="99">​

...但它似乎没有用，所以我显然误解或遗漏了什么。

Answer 1

我为你制作了这个demo，希望对你有帮助

http://jsfiddle.net/e2ScF/5/

$(function() {
$("#options").change(function(){
        setTarget() ; // Something has changed so lets rebuild the target
});
    $("#options2").change(function(){
        setTarget();// Something has changed so lets rebuild the target
});
});

// Just get the values you want and update the target
function setTarget(){
    var tmp = $("#options").val();
    tmp += $("#options2").val();
    $('#targetTextField').val(tmp);
}
​