弄清楚如何让我的 JavaScript 工作，但是花了非常非常非常长的时间。足以让我希望继续避免使用 javascript。我从一个复杂的页面开始，然后不断减少它并一点一点地将其更改为一个有效的简单示例。
最终发现方括号必须用两个反斜杠转义。但并不总是 - 显然在选择器中 - 但不是在 .attr('id', 'element[' + newNum + ']' 上下文中，然后转义那里是错误的。
我怎样才能更快地解决这个问题？我没有写太多的 javascript 或使用 Firebug 太多，因为我似乎浪费了太多时间，而在 c++ 中错误(通常)可以更快地找到，所以我对 javascript 感到恼火并避免使用它。
运行在 Firebug 打开时不起作用的代码不会显示任何错误。我已经尝试过脚本和控制台选项卡。
单击此按钮时，没有明显 react 。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#btnAdd').click(function() {
var num = $('.element').length-1;
var newNum = new Number(num + 1);
var newElem = $('#element[' + num + ']').clone().attr('id', 'element[' + newNum + ']');
$('#element[' + num + ']').after(newElem);
});
});
</script>
</head>
<body>
<form id="myForm">
<div id="element[0]" class="element">
description
<input type="text" name="element[0][description]" id="element[0][description]" value="desc0" />
</div>
<input type="button" id="btnAdd" value="add another name" />
</form>
</body>
</html>
单击此按钮时，将按预期创建一个新的列表元素。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#btnAdd').click(function() {
var num = $('.element').length-1;
var newNum = new Number(num + 1);
var newElem = $('#element\\[' + num + '\\]').clone().attr('id', 'element[' + newNum + ']');
$('#element\\[' + num + '\\]').after(newElem);
});
});
</script>
</head>
<body>
<form id="myForm">
<div id="element[0]" class="element">
description
<input type="text" name="element[0][description]" id="element[0][description]" value="desc0" />
</div>
<input type="button" id="btnAdd" value="add another name" />
</form>
</body>
</html>
最佳答案
在选择器中，[]具有特殊含义。它意味着找到一个属性。例如，以下代码查找文件类型的输入:
var fileInputs = $('input[type=file]');
我不知道你为什么使用[]作为你的id，你可以使用elementN，其中N是一个数字.
此外，虽然 JS 是一种 OOP 语言，但请避免在创建 native 对象时使用 new 语法(但也有异常(exception)，例如预定长度的数组)。您的 newNum 可以这样创建:
var newNum = num + 1;
对于 Firebug，它是最受欢迎的调试工具之一。如果它没有报告任何内容，那么要么是他们的错误，要么是您的代码工作正常，但不是您期望的那样。
关于javascript - Firebug 在调试方面能更有用吗？备择方案？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16294476/