1

所以，我承认我有点 JS 菜鸟，但据我所知，这应该有效，但事实并非如此。

背景：

我有一个带有 3 个列表框的表单。列表框命名为 app1、db1 和 db2。我使用 javascript 来允许用户添加额外的列表框，增加每个额外选择框的名称标签。

当我添加其他应用程序命名框时，每个附加字段的值都会正确递增。如果我尝试添加名为 selects 的附加 db，它无法通过数组识别第一个循环中的第二个标签。这导致我最终得到 2 个名为 db2 的元素。在每个后续标签上，它都被正确识别并正确递增。

这是 db1 标记的 HTML：

<select name="db1">
  *options*
</select>

和 db2：

<select name="db2">
  *options*
</select>

标签是相同的。这是我用来计算序列中下一个数字的函数（注意：标签是 app 或 db，标签是 DOM 中所有选择标签名称的数组，如果我检查标签，它会给我['app1', 'db1', 'db2', '']）：

function return_select_name(tag, tags) {
  matches = new Array();
  var re = new RegExp(tag + "\\d+", "g");
  for (var i = 0; i < tags.length; i++) {
    var found = re.exec(tags[i]);
    if (found != null) {
      matches.push(found[0]);
    }
  }
  matches = matches.sort();
  index = parseInt(/\d+/.exec(matches.last())) + 1;
  index = tag + index;
  return index;
}

如果我添加一个应用程序标签，它将返回“app2”。如果我搜索一个 db 标签，它会在第一次返回“db2”，第二次返回 db3，等等。

所以基本上，我确定我在这里做错了什么。

4

3 回答 3

2

我会通过为 db 保留一个计数器和一个用于应用程序生成名称的计数器来处理它。

var appCounter = 1;//set this manually or initialize to 0 and
var dbCounter = 2;//use your create function to add your elements on pageload

然后，当您创建下一个标签时，只需增加您的计数器并将其用作您名字的后缀：

var newAppElement = document.createElement('select');
newAppElement.name = 'app' + (++appCounter);
..

//  --OR for the db element--

var newDbElement = document.createElement('select');
newDbElement.name = 'db' + (++dbCounter );
..
于 2012-06-04T13:23:58.877 回答
1

您遇到的问题是正则表达式对象是有状态的。您可以通过将正则表达式创建放入循环中来修复您的程序。

function return_select_name(tag, tags) {
  matches = new Array();
  // <-- regex was here
  for (var i = 0; i < tags.length; i++) {
    var re = new RegExp(tag + "\\d+", "g"); //<--- now is here
    var found = re.exec(tags[i]);
    if (found != null) {
      matches.push(found[0]);
    }
  }
  matches = matches.sort();
  index = parseInt(/\d+/.exec(matches[matches.length-1])) + 1; //<--- I dont think matches.last is portable, btw
  index = tag + index;
  return index;
}

无论如何，如果我自己这样做，我可能更愿意避免复杂的文本匹配，而只是将下一个标签索引存储在变量或哈希映射中。

另一个建议：如果你在你的正则表达式中加上括号：

// /tag(\d+)/
var re = new RegExp(tag + "(\\d+)", "g");

然后，您可以使用found[1]直接获取您的号码，之后无需额外步骤。

于 2012-06-04T13:40:24.430 回答
0

我知道这已经得到了回答，但我把它放在一起作为概念证明。

http://jsfiddle.net/zero21xxx/LzyTf/

它是一个对象，因此您可以在不同的场景中重用它。显然有一些方法可以改进它，但我认为它很酷，所以我想我会分享。

console.debug唯一适用于 Chrome 和 FF 的。

于 2012-06-04T13:58:17.307 回答