使用动态表单

时间：2016-06-07 21:31:07

标签： javascript php jquery

我有一些PHP输出JavaScript。我需要动态设置id。由于使用了i变量，以下代码在第3行中断。我希望这是引号的一个简单问题，但我可能错了。

$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 个答案:

答案 0 :(得分：3)

这有用吗？

$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++; 
});

答案 1 :(得分：2)

此处的问题是，无论何时点击，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;的展示位置。所以你的代码应该是：

$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++; });';

您无需在上面的代码中转义"。 :)

答案 2 :(得分：0)

您的代码开头存在许多问题：

变量var i=0在函数内声明，因此它总是被重置，永远不会超过1。

解决方案：您只需在页面加载时声明一次，例如在<head>部分的脚本标记中或jquery文档就绪调用内。我在下面展示了一个例子。

请使用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;

?>

输出：

enter image description here

也许您只是忘记包含jquery库。

将其添加到您的<head>部分：

<script src="//code.jquery.com/jquery-1.10.2.js"></script>
相关问题
最新问题