使用click事件为动态表单设置JavaScript变量
[英]Setting JavaScript variable with click event for dynamic form
问题描述
我有一些PHP输出JavaScript 。 我需要动态设置id 。 由于使用了i变量，因此以下代码在第三行中断。 我希望这是引号引起的一个简单问题，但我可能是错的。
$html .='$("#add").click(function (e) {';
$html .= 'var i=0;';
//Append a new row of code to the "#items" div
$html .='$("#items").append(\'<div><input name=\"input[]\" type=\"text\" id=\"itin_form_'+i+'\" /><button class=\"delete\">Delete</button></div>\'); i++; });';
谁能看到为什么此代码失败？
3 个解决方案
解决方案1
3 已采纳 2016-06-07 21:47:17
这样行吗？
$html .= 'var i=0;';
$html .='$("#add").click(function (e) {';
//Append a new row of code to the "#items" div
$html .='$("#items").append(\'<div><input name="input[]" type="text" id="itin_form_\'+i+\'" /><button class="delete">Delete</button></div>\'); i++; });';
当转义为Javascript时，应返回：
var i=0;
$("#add").click(function (e) {
$("#items").append('<div><input name="input[]" type="text" id="itin_form_'+i+'" /><button class="delete">Delete</button></div>');
i++;
});
解决方案2
2 2016-06-07 21:49:08
这里的问题是，无论何时单击， i的值都会初始化为0 。 这确实是一个简单的愚蠢的错误。 您的代码为您提供了以下结果：
$("#add").click(function (e) {
var i=0;
$("#items").append('<div><input name="input[]" type="text" id="itin_form_'+i+'" /><button class="delete">Delete</button></div>');
i++;
});
但是它应该有这样的东西：
var i = 0;
$("#add").click(function (e) {
$("#items").append('<div><input name="input[]" type="text" id="itin_form_'+i+'" /><button class="delete">Delete</button></div>');
i++;
});
参见var i = 0;的位置var i = 0; 以上。 因此，您的代码应为：
$html .= 'var i=0;';
$html .='$("#add").click(function (e) {';
//Append a new row of code to the "#items" div
$html .='$("#items").append(\'<div><input name="input[]" type="text\\" id=\"itin_form_\'+i+\'" /><button class="delete">Delete</button></div>\'); i++; });';
您无需在上面的代码中转义" 。 :)
解决方案3
0 2016-06-08 03:52:05
首先，您的代码有很多问题：
变量var i=0在函数内部声明，因此它总是被重置并且永远不会超过1。
解决方案 ：您只需在页面加载时声明一次即可，例如，在<head>部分的脚本标签中或在jquery文档ready调用内部即可。 我在下面展示了一个例子。
请使用PHP nowdoc摆脱所有这些转义字符：
这是一个示例test.php经过测试，可以按原样使用您的javascript代码创建自己（我只是删除了所有转义字符以使其更具可读性）：
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<div id="items"></div>
<input type="button" id="add" value="Add" />
<?php
$str =
<<<'EOT'
<script>
/* Start of Nowdoc
you can paste javascript code in here as-is!
*/
var i=0; // notice how I declared this outside of add.click
$("#add").click(function (e) {
$("#items").append('<div><input name="input[]" type="text" id="itin_form_'+i+'" /><button class="delete">Delete</button></div>');
i++;
}
);
/* End of Nowdoc */
</script>
EOT;
echo $str;
?>
输出：
也许您只是忘了包含jquery库。
将此添加到您的<head>部分：
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
使用Javascript设置点击事件
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.