javascript - Firebug 能否在调试方面更有用？备择方案？-6ren

javascript - Firebug 能否在调试方面更有用？备择方案？

转载作者：行者123 更新时间：2023-11-29 22:14:03

弄清楚了如何让我的 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>