Question

当内容未通过ajax

添加时，此功能正常

$('#element a img').css({ 'opacity': '0.5' });

但是，当通过ajax调用添加元素时，它不起作用。我熟悉live和bind，但这些都是针对事件的。

在我通过ajax添加元素之后，我需要做一些初始化，比如在第一个添加一个span，并在新添加的项目上设置不透明度等。

如何初始化通过ajax添加的元素？

Answer 1

尝试在Ajax完成处理程序中设置css规则，当元素实际存在于页面上时：

$.ajax({
    url: 'ajax/test.html',
    success: function(data) {  },
    complete: function() { 
        $('#element a img').css('opacity', '0.5'); 
    }
});

Answer 2

您指定的初始函数调用适用于“未由AJAX加载”DOM元素，因为在调用它时，它仅在调用函数时执行与选择器匹配的DOM元素。你基本上是在说'对所有元素都这样做并停止。'它不会为与选择器匹配的新元素监视DOM。

作为$ .ajax（）/。get（）/。post回调函数的一部分，您可以调用$（）。css（）;功能

虽然已弃用，但也许$.live();可能适合您现在的需求。 $ .live（）;目前被$ .on（）取代;但$ .delegate（）;也可以满足您的需求。

虽然可能不是大多数语法上的正确（它是凌晨3点！）我做了一个快速的JSFiddle来使用$ .delegate（）;在http://jsfiddle.net/ZpN2y/

只需单击输入按钮，然后单击创建的div。你可以看到我只调用一次委托，并在div appender之外。这很可能适合您的使用。不幸的是，我对.delegate和.on的体验绝对没有。

Answer 3

即使您通过ajax调用添加了元素，普通的jQuery选择仍然可以正常工作。

尝试使用Chrome，IE或Firefox中的开发者工具，确保使用ajax调用插入的元素确实符合您期望的结构。

Jquery - 如何通过Ajax调用初始化添加到DOM的元素

3 个答案: