动态添加事件的正确方法是什么？

| 目的是，当我专注于最后一个文本行时，在其下方出现另一个文本行。然后在一定数量的行上禁用它。 我似乎无法弄清楚这里出了什么问题： 
$(document).ready(function() {
    lineCount = 0;
    $(\"form#qc\").delegate(\"input:text:last-child\", \"focus\", newTextLine);
});

function newTextLine() {
    newLine = (\"<div id=\'ansInput{0}\'>Answer {0}: <input type=\'text\' name=\'ans1\' /></div><!--ans1-->\").format(lineCount);
    currentDiv = (\"#ansInput{0}\").format(lineCount);
    $(currentDiv).after(newLine);
    lineCount = lineCount++;
}
这是HTML页面： 
<form id=\"qc\" name=\"qc\">
<h2>Create New Question!</h2>
<div id=\"ansInput0\">Question: <input type=\"text\" name=\"Question\" /></div><!--question-->
<input type=\"submit\" value=\"Submit\" />
</form>
我得到一个非常非常奇怪的结果：每次出现两行，并且所有索引都为
0
，并且都响应假定仅对最后一个起作用的事件处理程序。 任何想法代码有什么问题吗？ JS小提琴 也欢迎任何有关如何使代码更智能的建议！     
2020-05-27 3 条评论
分享

没有找到相关结果

    已邀请:

    疮痪徘弦漏

            如前所述，您的代码中存在一些问题。 我会这样尝试： 克隆最后一个div，更改id并清除输入的值： 
    $(function() {
    $(\"#qc>div:last-of-type>input\").live(\'focus\', function() {
        $(this).parent().after($(this).parent().clone().attr(\'id\', \'ansInput\' + $(\'#qc>div\').length).find(\'input\').val(\'\').end());
    });
});
    http://jsfiddle.net/7enNF/1/ input：text：last-child选择作为其父级中最后一个子元素的输入。因此它将选择所有输入，因为每个输入都是ansInput div中唯一的（因此最后一个）子级 #qc> div：last-of-type> input选择最后一个div中的输入。我使用了last-of-type，因为last-child与div不匹配，因为Submit按钮是表单的最后一个孩子 结束是必须的，因为我选择了div，然后我用\“ find（\'input \'）\”选择输入以清除值。如果我以这种方式离开它，它将只插入输入（而不是div）。因此，end（）再次从输入返回div，以便插入div。 我希望这不会太令人困惑！ :)     
    2020-05-27 0 0
    分享

    校勒魏寡

            我在这里看到几个问题。首先，根据您提供的代码，我看不到lineCount变量的作用域。其次，仅因为您正在向要创建的新元素中添加事件处理程序，并不意味着您就将其从旧元素中删除。     
    2020-05-27 0 0
    分享
    为什么被折叠? 0 个回复被折叠

    要回复问题请先登录或注册

    或代码 OrCode.com 备案号：粤ICP备15020848号-1
    Escape time: 0.065788984298706