0

我在里面使用了简单的滑块，其中的内容加载了 Jquery.load()，当您单击我的投资组合页面上的缩略图时会调用该滑块。问题是第一次单击缩略图并加载内容时，滑块不起作用，但是如果您使用滑块关闭 div 并重新单击缩略图以重新打开它，它就会开始工作。我感觉它与 Jquery.load() 有关。这是网站iancramergraphics.com/new

抱歉，这是我第一次在论坛上发帖，所以我仍然习惯于提出我的问题的最佳方式。我之前也没有创建自己的 js fiddle，我不确定如何包含我的 jquery ajax 调用。这是我的 .js 和 html（我希望这足以帮助您理解）

​</p> 

$(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: ""
    });
}
});​

我尝试在 (document).ready 中移动 easyslider 声明，但没有运气

谢谢你

html 没有发布在最后一个上。这里是

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

3 回答 3

0

You are binding plugin on dinamically loaded content, you need something like this http://docs.jquery.com/Plugins/livequery (pretty much lightweight)

then you can do:

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

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

or better (should work) using ajax without the plugin i linked to:

$('.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-03T17:51:56.703 回答
0

我让它工作了。我无法让插件工作或第二组 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-03T19:37:53.347 回答
0

我无法获得您建议的插件或第二组代码（我确定只是因为我对 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-03T19:41:09.187 回答