调用类属性不起作用

Calling class attribute not working

本文关键字：不起作用 属性 调用      更新时间：2024-02-16

我想在每个容器之后创建一个点击函数。它起了作用，但现在不行了。当我想创建事件时，他不会识别容器，因为在调试器中，我可以看到他正在查看代码框。

 // Decide list order, load the thumbnail for each publication.
            var place = "first";
            $('#archive').prepend('<div class="container" id="'+entry.publicationID+'"></div>');
            $('.container:' + place).append('<div class="thumb"></div>');
            $('.thumb:' + place).css("background-image", 'url(' + entry.thumbnailURL + ')');
            $('.thumb:' + place).css("filter", 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' + entry.thumbnailURL + ',sizingMethod="scale")');
            $('.thumb:' + place).css("-ms-filter", 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src=' + entry.thumbnailURL + ',sizingMethod="scale")');
            // Load the publication title below each thumbnail.
            $('.thumb:' + place).after('<div class="title"></div>');
            $('.title:' + place).append(entry.publicationName);
            // Load the publication startsdate & enddate.
            $('.title:' + place).after('<div class="date"></div>');
            $('.date:' + place).append(sdate + " tot " + edate);
            // Set up publication links.
            $('.container:' + place).click(function(){
                loadPub(entry.publicationID, entry.publicationName);
                setActive(entry.publicationID);
                //Change css of current element         
            });

http://api.jquery.com/on/这将对你有所帮助。基本上，点击动态创建的div或框的外部容器并检查目标，这是由jQuery 中的"on"api完成的

如果要动态加载这些元素，则需要使用.on和委托事件，以便在加载DOM后加载的元素知道要附加单击处理程序。

下面是我使用.on()的示例。我在选择器中声明我的父容器和我想将事件侦听器委托给的特定元素。在这种情况下，我可以指定伪类:first，jQuery足够聪明，知道只对第一个元素执行此操作。

$(document).ready(function(e) {
  for (var i = 0; i < 10; i++) {
    $('#container').append('<div class="element">Element ' + i + '</div>');
  }
  $('#container').on('click', ':first', function(e) {
    alert('hello! this should only work on the first element!');
  });
});
.element {
  height: 50px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="container">
</div>

相关文章：