我想根据所选的选项更改表单的目标。
<form id='post_form' target="targetvalue">
<select id="select" name="select">
<option value="option1">Option 1</option>
<option value="option2">Option 2</option>
</select>
</form>
<script>
$("#select").change(function() {
var targetvalue = $("#select option:selected").text();
$("#post_form").attr("target", targetvalue);
});
</script>
答案 0 :(得分:14)
如果您想将target
设置为Option 1
或Option 2
,您所拥有的是正确的。但是,如果您要将目标设置为option1
或option2
,则应该:
var targetvalue = $("#select option:selected").val();
可以简化为;
var targetvalue = $(this).val();
如果你正在使用jQuery&gt; 1.6,您应该使用prop()
而不是attr()
。有关更多详细信息,请参阅StackOverflow:.prop() vs .attr()
$("#select").change(function() {
var targetvalue = /* which ever you decide */;
$("#post_form").prop("target", targetvalue);
});
您不应该真正链接到生产环境中的最新版本;如果一个新版本的jQuery随着重大变化而发布,那你就搞砸了。链接到特定版本的jQuery,并在升级到新版本之前进行彻底测试;
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
如果您仅在<script>
元素之后定义<form>
以便能够定位它,请意识到您可以使用$(document).ready()
阻止在任何地方定义脚本;
<script>
$(document).ready(function () {
$('#select').change(function () {
var targetvalue = /* which ever you decide */;
$('#post_form').prop("target", targetvalue);
});
});
</script>
答案 1 :(得分:0)
如果您的HTML页面确实按照问题中的指定编写,那么脚本将在使用您尝试修改的表单更新DOM后运行 - 但如果脚本是在当时链接的JavaScript文件的一部分你需要将它包含在$(document).ready()函数....
中感谢@ T.J.Crowder链接以下文章 - &gt; Document ready event ?
将您的脚本放在$(document).ready()块中 - 这将确保DOM准备就绪,然后再尝试更改它:
<script type="text/javascript">
$(document).ready(function() {
$("#select").change(function() {
var targetvalue = $(this).val();
$("#post_form").prop("target", targetvalue);
});
});
</script>