Javascript jquery单击函数不适用于每个输入字段

在我的页面上，当我按下“Schritt hinzufügen”按钮时，我可以创建一个带有2个字段（1x输入类型文本，1x文本区域）的新div容器。 如果我按下“Schritt entfernen”按钮，它将移除最后一个容器。我使用jquery执行此操作。如果我按下按钮“Erstellen”，jquery将检查是否所有字段都已填充（没有输入字段类型文件）。如果某些字段未填充，则会显示红色边框

但是现在我想，当我聚焦一个输入字段时，红色的边缘会消失。它不是100%有效。在这段代码上，它可以工作（不是用jquery创建的）：

AllgemeinesZum教程
蒂泰尔德斯教程酒店


Autor des教程



贝施雷本德教程酒店

我需要查看创建新元素的函数才能完全确定，但从我看到的情况来看，我认为在创建新元素时需要重新应用单击侦听器。它们不是“追溯性”的，这意味着您添加的“单击”将针对您设置它们时dom中的内容，而不是您随后创建的新元素

我试着通过控制台在你的页面上用你的代码设置点击事件，效果很好。 因此，在创建新元素时，您可能可以使用以下内容：

$(your_new_element).click(function(){
    $(this).removeClass("empty_field");
});

在要为其执行此行为的每个创建的元素上

编辑：

大概是这样的：

 $(add_button).click(function(){ //on add input button click
        if(x < max_fields){ //max input box allowed
            $(wrapper).append('<div class="step"><div class="header_step">Schritt '+ x +' des Tutorial\'s</div><div class="body_step"><a class="create_tutorial_a">Titel des Schrittes</a><input name="input_title_name'+x+'" class="create_tutorial_input" type="text" /><br><a class="create_tutorial_a">Bild</a><input type="file" /><br><br><a class="create_tutorial_a_full_width">Beschreibung des Schrittes</a><br><textarea class="create_tutorial_textarea" name="input_description_name'+x+'"></textarea></div>');
            x++; //text box increment
        }
    add_click_events();
    });

function add_click_events(){
 $('input[type="text"]').last().click(function(){
        $(this).removeClass("empty_field");
    });

    $('textarea').last().click(function(){
        $(this).removeClass("empty_field");
    });
}

$（添加按钮）。单击（函数（）{//在添加输入按钮上单击
如果（xBild

Beschreibung des Schrittes
'）；
x++；//文本框增量
}
添加点击事件（）；
});
函数添加\单击\事件（）{
$（'input[type=“text”]”）。最后一个（）。单击（函数（）{
$（此）.removeClass（“空_字段”）；
});
$（'textarea'）.last（）。单击（函数（）{
$（此）.removeClass（“空_字段”）；
});
}

---

并在第一次启动时添加add_click_events（）。

仅供参考，因为您已经将

add_按钮

和

remove_步骤

定义为jQuery元素，所以在附加click处理程序时不需要额外将它们包装在bling中。我不确定是否有任何性能影响（或者jQuery是否足够聪明，不会创建另一个jQuery对象）。无论如何，以下内容就足够了：）

var add_button=$（“#add_step”）；添加按钮。单击（函数（）{…}）