【发布时间】：2013-12-11 12:55:49
【问题描述】：
我想在我网站的特定区域加载新内容 - 效果很好。但是在加载这个之后，所有其他 jquery 功能都没有加载。使用以下代码，我的“继续阅读切换”什么也不想做。有没有办法解决这个问题？
/** =================================================================
* pagination fade
* ================================================================== */
$('#Pagination a').on('click', function(e){
var link = $(this).attr('href');
e.preventDefault();
$('#inner').animate({opacity: 0.0}, 500, 'linear', function(){
$(this).load(link + ' #postcontent', function() {
$(this).animate({opacity: 1}, 500, 'linear');
});
});
});
/** =================================================================
continue reading toggle
================================================================== */
$('.continue-reading a').click(function(){
$(this).closest('p').next('.continue-reading_content').slideToggle("slow");
}).toggle(function() {
$(this).text(continueReading_close);
}, function() {
$(this).text(continueReading_open);
});
这是一个开始的小提琴：http://jsfiddle.net/Ccj32/4/
这是最终代码
jQuery(document).ready(function($) {
/** =================================================================
* pagination fade
* http://stackoverflow.com/questions/15983244/simple-wordpress-ajax-pagination
* ================================================================== */
$(document).on('click', '#Pagination a', function(e){
var link = $(this).attr('href');
e.preventDefault();
$('#inner').animate({opacity: 0.0}, 500, 'linear', function(){
$(this).load(link + ' #postcontent', function() {
$(this).animate({opacity: 1}, 500, 'linear');
});
});
});
/** =================================================================
continue reading toggle
================================================================== */
$(document).on('click', '.continue-reading a', function(e){
e.preventDefault();
// old selectors
//$(this).closest('p').next('.continue-reading_content').slideToggle("slow", function(){
// $(this).closest('.entry-content').find('.continue-reading_content').slideToggle("slow", function(){
// new selector to prevent if there is no <p> in content
$(this).closest('.entry-content').children('.continue-reading_content').slideToggle("slow", function(){
if ($('.continue-reading_content').is(':hidden'))
{
$('.continue-reading a').text(continueReading_open);
}
else
{
$('.continue-reading a').text(continueReading_close);
}
});
});
});
将事件处理程序设置为文档后，代码可以正常工作：http://jsfiddle.net/Ccj32/7/
【问题讨论】：
-
您是否在页面中动态加载“.continue-reading a”？
-
是的，您的事件处理程序应该设置为文档。当您加载新内容时，它不会将任何事件处理程序应用于新元素。
标签： jquery wordpress onclick pagination preventdefault