2 
<div class="pad" id="test" contenteditable="true" spellcheck="false">
    <div id="a0" class="lines" > text1</div>
</div>

我有一个内容可编辑的 div，其中有许多子 div，当用户按下 ENTER 键（使用 jQuery）转到下一行时，这些子 div 会动态生成。子 div 的示例是上面的id='a0'。

目标：动态生成唯一的 id 并将其分配给这些动态生成的子 div。

下面是我用来完成此任务的 jQuery。

function getSelectedNode()

这是返回用户当前正在输入的行（即子 div）的“id”的函数。

var lineCount=0;

lineCount变量的值等于生成的子 div 的总数。

 $(currentLine).next().attr('id','a'+(++lineCount));

这里currentLine包含用户当前正在输入的行的id。按下 ENTER 键后，新 div 会在当前 div 之后自动生成，我尝试访问 using.next()并尝试使用 为其分配新 id .attr('id','a'+(++lineCount))。

如果我在 jQuery 的选择器子句中传递绝对值，则分配新 id 的过程效果很好，即：

$('#a0').next().attr('id','a'+(++lineCount));

代替

$(currentLine).next().attr('id','a'+(++lineCount));

var lineCount = 0;
var currentLine = "#a0";

function getSelectedNode() {
    if (document.selection) 
        return document.selection.createRange().parentElement();
    else {
        var selection = window.getSelection();

        if (selection.rangeCount > 0) 
          return selection.getRangeAt(0).startContainer.parentNode;
    }
}


$('.pad').keypress(function (event) {

    var keycode = (event.keyCode ? event.keyCode : event.which);

    if (keycode == '13') {
        var sn = getSelectedNode();
        currentLine = "#" + sn.getAttribute('id');

        $(currentLine).next().attr('id', 'a' + (++lineCount));
    }
});
4

1 回答 1

0

Javascript是单线程的，所以你可以为此使用一个int ...

var indexer = 0;
function getUniqueId(){
   indexer++;
   return indexer.toString();
}

警告：我不建议在大多数 Web 应用程序中在文档级别声明函数和属性。一旦你有了这个方法，它就很容易实现......

$("<div id='myDiv" + getUniqueId() + "' />");
于 2013-03-12T14:09:21.407 回答