我创建了一个自定义脚本,允许使用 ajax(ajax html 内容加载器)加载 html 内容。此脚本在元素单击时启动。
此脚本适用于单击时的硬编码元素。
但是,在我的 html 中,由于单击,我添加了很多元素。
这个新的附加元素无法通过我的 ajax html 内容加载器加载内容。
我需要回调我的 ajax 脚本以使其适用于新的附加元素。
我不知道如何编写脚本才能进行回调。
这是我的脚本:
$(function ajax() {
function ajaxify(file) {
$.get(file, function (data) {
var folderContent = $("#bottom-container");
$("#prev-ajax").fadeOut(0);
$("#next-ajax").fadeOut(0);
folderContent.slideToggle(1000,"easeOutCirc", function () {;
$("#loading-bloc").show();
$("#loading-text").fadeIn(500);
$("#ajaxify_container").hide( function () {
$("#loading-bloc").everyTime(10, function(){
$("#loading-bloc").animate({left:"100%"}, 1000).animate({left:"0%"}, 1000);
});
$("#ajaxify_container").show( function () {
folderContent.slideToggle(1000,"easeOutCirc");
$("#loading-bloc").hide();
$("#loading-text").fadeOut(500);
$("#prev-ajax").fadeIn(300);
$("#next-ajax").fadeIn(300);
});
});
});
});
}
$('.link:not("#prev-ajax,#next-ajax")').on("click",function (e) {
e.preventDefault();
var functionAlink = $(this);
var functionBlink = $(this);
var $parent= functionAlink.parents('.element');
var prev = $parent.prev().find('.link').attr('href');
var next = $parent.next().find('.link').attr('href');
if (typeof prev != 'undefined' ) {
$("#prev-ajax").attr('href', prev);
$("#prev-ajax").animate({opacity: 1}, 300);
}else {
$("#prev-ajax").removeAttr("href");
$("#prev-ajax").animate({opacity: 0.4}, 300);
}
if (typeof next != 'undefined' ) {
$("#next-ajax").attr('href', next);
$("#next-ajax").animate({opacity: 1}, 300);
}else {
$("#next-ajax").removeAttr("href");
$("#next-ajax").animate({opacity: 0.4}, 300);
}
var link = functionBlink;
if (!link.hasClass('current')) {
$('.link').removeClass('current');
link.addClass('current');
ajaxify(link.attr('href'));
window.location.hash = link.attr("href");
}
return false;
});
$("#prev-ajax,#next-ajax").on("click",function (e) {
e.preventDefault();
var functionAlink = $(this);
var functionBlink = $(this);
//$("#prev-ajax").fadeOut(0);
//$("#next-ajax").fadeOut(0);
ajaxify(functionAlink.attr('href'));
window.location.hash = functionAlink.attr("href");
$('.link').removeClass('current');
var href = functionBlink.attr('href');
var link = $(".link[href*= '" + href + "']:not(#prev-ajax, #next-ajax)");
link.addClass('current');
var $parent = link.parents('.element');
var prev = $parent.prev().find('.link').attr('href');
var next = $parent.next().find('.link').attr('href');
if (typeof prev != 'undefined' ) {
$("#prev-ajax").attr('href', prev);
$("#prev-ajax").animate({opacity: 1}, 300);
}else {
$("#prev-ajax").removeAttr("href");
$("#prev-ajax").animate({opacity: 0.4}, 300);
}
if (typeof next != 'undefined' ) {
$("#next-ajax").attr('href', next);
$("#next-ajax").animate({opacity: 1}, 300);
}else {
$("#next-ajax").removeAttr("href");
$("#next-ajax").animate({opacity: 0.4}, 300);
}
});
});
$(function(){
$(window).hashchange( function(){
var hash = window.location.hash;
var hash = location.hash.replace("#","");
if(window.location.hash) {
$.get(hash, function (data) {
$('#LoadingImage').show();
$("#ajaxify_container").fadeOut(1500, function () {
$(this).html(data).fadeIn(1500, function () {
$('#LoadingImage').hide();
});
});
});
} else {
// Fragment doesn't exist
}
})
$(window).hashchange();
});
对不起我的英语,我是法国人
洛伊克