Javascript 将表单输入值与所选选项组合
我想通过使用jQuery实时组合选项字段和输入字段中的值Javascript 将表单输入值与所选选项组合,javascript,jquery,Javascript,Jquery,我想通过使用jQuery实时组合选项字段和输入字段中的值 <input name="recipe" id="recipe" value="tablespoons" /> <select id="spoon_value" name="spoon_value"> <option value="1" selected="">1</option> <option value="2">2</option> <option val
<input name="recipe" id="recipe" value="tablespoons" />
<select id="spoon_value" name="spoon_value">
<option value="1" selected="">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
我想要的输出是2个TableSpoons或3个TableSpoons等等。您的
每个函数中的选择器周围缺少引号--您还有一个每个函数以ID为目标，这是不好的，因为这很可能意味着您在重复ID。以下是代码的语法正确版本：
$('select#spoon_value').each(function(i) {
var someData = $("select[name=spoon_value] option[value=" + this.data.spoon_value + "]").html() + this.data.recipe;
});
函数ux）{
返回文档.getElementById（x）；
}
函数更新（）{
var tbsVal=uu（“匙值”）。值；
var输出=tbsVal+“汤匙”；
_（“realtimeTbsVal”）.innerHTML=输出；
}
1.
2.
3.
哟
您发布的代码有语法错误是的，这就是我来这里的原因@尼古拉斯，我从20小时前就开始打电话了。我甚至不能很好地打字：你知道，stackoverflow不是一个调试平台。。。如果您无法修复这种语法错误，那么GL！我想我应该把它发布在代码审查部分。对不起，我没有用过，但我相当肯定这更多是为了改进工作代码，而不是调试jquery选择器：）。根据我在那里看到的前几个问题的阅读。只是测试了一下，它也不起作用。我想我应该尝试一下这个方法，但它会在更改选项时删除值。上面的代码实际上做了任何事情……它只是创建了一个变量，你对这个变量做了什么吗？是的，我的朋友，我添加了$（'#recipe'）.val（'someData'）
和$（'[name=recipe]'）.val（someData）；在
结尾处。尝试$（'#recipe'）.val（someData）--不要引用variables这很糟糕，我无法使用此函数获取输出。尽管控制台中没有错误<代码>jQuery（'select#spoon_value'）.change（函数（$）{var someData=$（'select[name=spoon_value]选项[value=“+this.data.spoon_value+”]）.html（）+this.data.recipe；jQuery（'input#recipe'）.val（someData）；}）无论如何，我通过将旧值存储到变量中，然后在函数jQuery（'input#recipe'）.val（option+old）的末尾将这两个值组合在一起，使它工作起来感谢您的帮助和时间。我知道请求了jQuery，但纯javascript可以更高效地完成同样的事情。如果您想保留汤匙值的输入，只需创建一个新的javascript变量，并将它们连接到与上面类似的位置。对其进行了测试。它起作用了。但它需要在更改选项后单击主体。看看这里：我认为这就是简单javascript和jQuery之间的区别：D@Waqas是否希望在选择新值后立即更新该值？var output=tbsVal+“”+old；（如果您想在数字和文本之间留一个空格）
$('select#spoon_value').each(function(i) {
var someData = $("select[name=spoon_value] option[value=" + this.data.spoon_value + "]").html() + this.data.recipe;
});
<!doctype>
<html>
<head>
<script>
function _(x){
return document.getElementById(x);
}
function update() {
var tbsVal = _("spoon_value").value;
var output = tbsVal + " tablespoons";
_("realtimeTbsVal").innerHTML = output;
}
</script>
</head>
<body>
<form action="yourFileName" method="post">
<select id="spoon_value" name="spoon_value" onblur="update()">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
</select>
<input type="submit" value="Submit">
</form>
<div id="realtimeTbsVal">yo</div>
</body>
</html>