AJAX load() не выполняется более одного раза

Перенос веб-сайта на сервер, и теперь мой JS-файл кажется полуразрушенным. При нажатии на фотографии AJAX должен загружать новую страницу в почтовый ящик. Однако я не могу понять, почему он выполняется только один раз, а затем перестает работать. Проверьте это.AJAX load() не выполняется более одного раза

http://affinity-cap.com/services/

и файл JS:

(function($) { 
    $("#wealthpic").click(function(){ 
    $("#main").load("http://affinity-cap.com/wealth-management/ .post-box"); 
    }) 
    $("#portpic").click(function(){ 
    $("#main").load("http://affinity-cap.com/portfolio-management/ .post-box"); 
    }) 
    $("#retirepic").click(function(){ 
    $("#main").load("http://affinity-cap.com/retirement-consulting/ .post-box"); 
    }) 
    $(".service-pic").click(function(){ 
    $(".post-box").animate({ 
    opacity: 0.1 
    }, 1500); 
    }) 
}(jQuery));

Оценил помощь. Благодарю.

источник

2014-02-06 user2464332

Вы уверены, что это не имеет никакого отношения к событию click? –

Предполагая, что каждый элемент управления используется '# main' [** Event Delegation **] (http://learn.jquery.com/events/event-delegation/) – Satpal

Возможно, ваша нагрузка удаляет события кликов из на странице, как вы думаете, это так? Чтобы узнать, замените ли ваши нагрузки что-то вроде предупреждения («Уволен»); затем щелкните и посмотрите, так ли это. Также вы можете использовать «on» вместо этого. Вот ссылка на другую проблему, которая может быть той же проблемой: http://stackoverflow.com/questions/11074261/jquery-click-event-stops-working-after-one-click – Severun

#main содержит изображения, на которые вы кликните. Когда вы перезагружаете #main, это вызовет проблемы с обработчиками, установленными на изображениях. Вы должны переместить эти изображения в отдельный div.

источник

2014-02-06 21:34:08 jwang

Попробуйте следующее, он должен заменить клик события, когда "главный" перезагружается:

(function($) { 
    $("#main").on("click", "#wealthpic", function(){ 
     $("#main").load("http://affinity-cap.com/wealth-management/ .post-box"); 
    }) 
    $("#main").on("click", "#portpic", function(){ 
     $("#main").load("http://affinity-cap.com/portfolio-management/ .post-box"); 
    }) 
    $("#main").on("click","#retirepic", function(){ 
     $("#main").load("http://affinity-cap.com/retirement-consulting/ .post-box"); 
    }) 
    $(".service-pic").click(function(){ 
    $(".post-box").animate({ 
    opacity: 0.1 
    }, 1500); 
    }) 
}(jQuery));

источник

2014-02-06 21:41:59 Severun

он не заменит события щелчка , вместо этого они просто никогда не будут удалены. –

сделать ваш HTML:

<div id="wealthpic" tail="wealth-management"></div> 
<div id="portpic" tail="portfolio-management"></div> 
<div id="retirepic" tail="retirement-consulting"></div>

и JQuery:

(function($) { 

    /*define variables for repeatable use, if needed elsewhere*/ 
    var url = 'http://affinity-cap.com/', 

     main = $('#main'), 

     wealthPic = $('#wealthpic'), 
     portPic = $('#portpic'), 
     retirePic = $('#retirepic'), 

     postBoxTxt = ' .post-box', 
     postBox = $(postBox), 

     animationSpeed = 1500; 

    /*main action*/ 
    wealthPic.add(portPic).add(retirePic).click(function() { 
     //get html element tail attribute 
     var clickedElementTail = $(this).attr('tail'); 

     //fade postBox out 
     postBox.stop().fadeTo(animationSpeed/2, 0.1, function() { 
      //change postBox content 
      main.load(url+clickedElementTail+postBoxTxt, function() { 
       //fade postBox in 
       postBox.fadeTo(animationSpeed/2, 1); 
      }); 
     }); 

    }); 
}(jQuery));

и дайте мне знать;)

источник

2014-02-07 03:07:28

AJAX load() не выполняется более одного раза

ответ

Смежные вопросы