0

这个问题与那个有关 当用户输入数据并专注于另一个 div 时,此代码会隐藏 div

$(".Q,.A").blur(function(e) {
    if ($(this).val().length > 0 && $(this).siblings("input").val().length > 0) {
        $(this).parent().fadeOut(1000);
        getData("ajaxPHP/insertNewWords.php?q='" + $(this).siblings('input').val() + "'&a='" + $(this).val() + "'&zestawID="+zestawID, "console");
        $(".main").append("<div><input type='text' class='Q'></input><input type='text' class='A'></input></div><br>");
    }
});

当用户输入数据时,这个 div 会隐藏并且脚本会创建新的 div(因此用户可以输入无限量的数据)。问题是:新创建的 div 不会隐藏。

那么,如果我想将新创建的 div 包含到“$(".Q,.A")" 中,我该怎么办?

4

2 回答 2

1

您可以在父容器上使用 jquery 的.on方法,因为事件“冒泡”到父容器。on 函数还允许您指定一个选择器来过滤动态应用的子元素,因此您可以在那里使用“.Q,.A”选择器:

$(document).ready(function(){
    $("#container").on("blur", ".Q,.A", function(e){
        if($(this).val().length>0 && $(this).siblings("input").val().length>0){
            $(this).parent().fadeOut(1000);
            $("#container").append('<div><input type="text" class="Q"><input type="text" class="A"></div>');
        }
    });
});

小提琴:http: //jsfiddle.net/rK3HS/1/

于 2013-08-03T11:34:52.100 回答
1

问题是(据我了解),您在页面上的一组节点上附加了一个行为,并且添加到页面的新节点不会采用此行为。

这是因为 JQuery 的工作方式。当您定义像 $(".Q,.A") 这样的选择器时,此选择器会评估为您页面上的一组已知节点。下面的代码仅适用于那些找到的元素。这个选择器永远不会再次被评估,所以任何新节点都没有机会获得你想要的行为。

解决方案是让 JQuery 在每次事件发生时重新评估选择器。因此,您需要在全局范围内监听事件,然后过滤以仅处理与您的选择器匹配的元素。

正确的方法是打开

$(document).on("blur", ".Q,.A", function(){ ... });  

见:http: //jsfiddle.net/sAT6L/

Live讨论了过去在每个 JQuery 版本中是如何完成的。

注意:您应该能够将范围限制为比 $(document) 更本地的内容。

于 2013-08-03T11:44:12.457 回答