簡單的滑塊不起作用，直到函數被調用兩次

我在內容中使用簡單的滑塊，內容中裝有Jquery.load（），當您單擊我的投資組合頁面上的縮略圖時會調用該內容。問題在於，第一次單擊縮略圖並加載內容時滑塊不起作用，但如果使用滑塊關閉div並重新點擊縮略圖以重新打開它，它就會開始工作。我有一種感覺，它與Jquery.load（）有關。這裏是網站iancramergraphics.com/new 簡單的滑塊不起作用，直到函數被調用兩次

抱歉，這是一個論壇，我第一次發貼，所以我還是老樣子習慣提出我的問題的最佳途徑。我還沒有創建我自己的js小提琴之前，我不知道我怎麼可以包括我的jquery ajax調用。這裏是我的.js和HTML（我希望這是足以幫助你理解）

$(document).ready(function() { 
var id = $(this).attr("id"); 

$('.thumbnails div').click(function() { 

    $('.portfolioDisplay').slideDown('fast'); 
    $("#slider").load('portfolio/' + id + ".html #slider > *"); 


    $("#slider").easySlider({ 
     continuous: true, 
     nextText: "", 
     prevText: "" 
    }); 
} 
});

我試圖向右移動的（文件）內easyslider聲明。就緒並沒有運氣

謝謝你

html沒有發佈最後一個。這裏是

<div class="thumbnails"> 
<div id="zubrickyremodeling"><img src="images/thumbnails/zubricky.png" alt="Zubricky   Remodeling" /></div> 
</div>

來源

2012-11-02 Ian

這將是很好，如果你粘貼一些代碼。如果你發佈小提琴更好。 –

請不要指望我們挖掘您的網站的代碼。另外，當你解決這個問題時，對於未來的讀者來說這裏沒有任何用處。請使用jsFiddle演示發佈相關代碼_along。 – Sparky

聽起來像插件的_initialization_，它通常發生在'document.ready'上實際上是在'load（）'上發生的。然後只有在'load（）'插件準備好用於後續點擊之後。這就像我願意去看一個[簡潔的自包含示例]一樣（http://sscce.org）。 – Sparky

您在dinamically加載的內容綁定插件，你需要像這樣http://docs.jquery.com/Plugins/livequery（非常輕巧）

那麼你可以做：

$("#slider").load(url); 

$.livequery(function(){ 
$("#slider").easySlider({ 
     continuous: true, 
     nextText: "", 
     prevText: "" 
    }); 
});

或更好的（應工作）使用阿賈克斯沒有插件我鏈接到：

$('.thumbnails div').on('click',function() { 
    $.ajax({ 
    url:'http://www.yoursite.com/portfolio/' + id + ".html #slider > *", 
    type:'GET', 
    data:{}, 
    dataType:'data', 
    error:function(){}, 
    beforeSend:function(){}, 
    success:function(_data){ 
    $('.portfolioDisplay').slideDown('fast'); 
    $('#slider').html(_data); 
    $("#slider").easySlider({ 
      continuous: true, 
      nextText: "", 
      prevText: "" 
     }); 
    } 
    }); 
});

來源

2012-11-03 17:51:56 sbaaaang

我懂了它國王。我無法得到插件工作或第二組ajax代碼（我敢肯定哪一個會工作，但我不能正確），但你的第二個反應告訴我，我必須使用.ajaxComplete事件。這是我想出了：

$('.thumbnails div').click(function(){ 
     var id = $(this).attr("id"); 

$("#slider").load('portfolio/' + id + ".html #slider > *"); 
     $('#slider').ajaxComplete(function(){ 
     $("#slider").easySlider({ 
      continuous: true, 
      nextText: "", 
      prevText: "" 
     });

和這個工作。非常感謝你的幫助

來源

2012-11-03 19:37:53 Ian

我無法獲得插件或第二組代碼，你建議工作（我相信只是因爲我對ajax缺乏經驗），但你讓我意識到我不得不在.load之後使用.ajaxComplete。這是我想出了：

$('.thumbnails div').click(function(){ 
     var id = $(this).attr("id"); 

    $("#slider").load('portfolio/' + id + ".html #slider > *"); 
     $('#slider').ajaxComplete(function(){ 
     $("#slider").easySlider({ 
      continuous: true, 
      nextText: "", 
      prevText: "" 
     }); 

     }); 
    });

來源

2012-11-03 19:41:09 Ian

簡單的滑塊不起作用，直到函數被調用兩次

回答

相關問題