jQuery：从多个字段中获取值并在文本字段中显示
我有6个不同的选择框和一个文本字段，我需要从中获取值并使用jQuery将其合并到一个文本字段中。
我基本上理解我将使用如下字符串为targetTextField构建值： $('#targetTextField').val(opt1+opt2+opt3+opt4+opt5+opt6+textField);
我该怎么用来获取select#options1的值并将其转换为opt1 ？
是否沿着opt1 = $('select#options1').val();的行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
Choose... Option 1 Option 2 Choose... Option 1 Option 2
…但它似乎没有工作，所以我显然误解或遗漏了一些东西。
我为你做了这个演示，希望它有所帮助
$(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); }
下拉试试以下
$('select option:selected').text()
看看这个它应该有希望给你一个指针，你需要做什么。 您可以将名称更改为类，然后只提供要在输入中显示的格式。 但是从你的问题中推测它应该是关于那个。
如果您对选择框有不同的ID
var toalopt=$('select option1:selected').text(); toalopt+=$('select option2:selected').text(); toalopt+=$('select option3:selected').text(); toalopt+=$('select option4:selected').text(); toalopt+=$('select option5:selected').text(); toalopt+=$('select option6:selected').text(); document.getElementById('id where you want to club data').innerHTML=toalopt;
如果您有相同的ID
$(document).ready(function(){ $('#optionvalue).click(function(){ var values =''; $('select[name="sameid"]').each(function(index,item){ values +=$(item).val() +' '; }); $('id where you want to club data').val(values); }); });
HTml将是带有id的普通select标签。
首先，为每个select元素添加一个类，以便更好地将它们标识为一个组：
然后在jQuery中，您可以使用map()创建值的数组并显示它们：
$(".auto-updater").change(function() { var values = $(".auto-updater").map(function() { return ($(this).val() == "") ? null : $(this).val(); // ignore default option select // return $(this).val(); // include all values }).get(); $("#targetTextField").val(values.join(',')); });
示例小提琴
您可以看到我已将其设置为忽略保留默认值的select元素。 如果取消注释其下方的行，则将包括所有选择，无论选择何种值。
您需要的最少代码如下：
$(function() { $("select").change(function(){ var opts=$('option:selected').val(); var oldVal=$('#targetTextField').val(); $('#targetTextField').val(oldVal+opts); }); });
在这里找到jsfiddle演示。