jquery .load()函数只在第一次工作

时间:2013-09-21 13:44:12

标签: javascript jquery html jquery-ui

所以我有一个我正在使用的网站,就像一个使用jQuery和jQuery UI的个人网站

以前我一直在使用隐藏的html代码,只是使用jquery来显示它。 但它使我的html文件变得混乱所以我想使用jquery的.load()来做同样的事情,但是从外部文件。

现在,它设置为.click函数。

对于我隐藏的html,每次单击特定元素时都会显示它。当您单击其他元素时。它隐藏了第一个。我是通过拥有2个类的div来实现的。问题是,当我尝试将html加载到隐藏的div中,然后显示并隐藏它时,它只在第一次工作。

够了,这是我的代码。 #1有效,#2仅适用于第一次点击。并且每次都留下imagearea空白。

$(".jquery").click(function(){

    clearImageArea();
    hideThumbnails(5);
    showThumbnails();
    $("#1").click(function(){

        $(".imagearea").html(js);
        $(".jscode").show(1000);
        $(".title").text("Extending jQuery");
    });
    $("#2").click(function(){
          $(".jquery2").empty();
          $(".jquery2").load("jqueryEx.html");


          var jquery2 =  $(".jquery2");
          $(".imagearea").html(jquery2);
          $(".jquery2").show(1000);
          $(".title").text("Extending Jquery Example");
      });


  });

现在我隐藏在我的html文件中的东西

首先我的html和js代码从jqueryEx.html加载到此处,并通过$(".hidden").hide();隐藏在我的javascript中的其他位置,然后通过.html()加载到imagearea中并通过{{1}显示}

.show()

我的另一个div看起来像是通过点击#1

放入imagearea
      <div class="jquery2 hidden">

      </div>

//许多js代码转义为html

    <div class="jscode hidden">
       <div class="block">
在我的JS代码的其他地方开始我有 </div> <!-- end of block--> </div> 将它加载到你之前看到的js变量中。

如果您想查看我正在处理的过时示例 转到www.3realsoft.com(只有cs和js工作技能)

如果您想查看我的代码的任何其他部分,请询问。其中大部分都在我的网站上。

2 个答案:

答案 0 :(得分:1)

我在搜索结果中找到了这个项目,当我试图让按钮加载并刷新内容时,加载工作正常但刷新无效。

以下是该解决方案的较短版本,将缓存设置为false是关键。在此其他链接上找到解决方案,但我在此处发布此概念,因为如果Google在此项目中放弃了我,其他寻找相同的人也可能会发现自己在这里。 John Millikin的道具,请务必回答他的回答并向他投票: Stop jQuery .load response from being cached

<script type="text/javascript">
    $(document).ready(function () {

        $.ajaxSetup({
            // Disable caching of AJAX responses
            cache: false
        });

        $('.detail-expand').click(function () {

            var detailRowElement = $(this).closest('.session-row-tr').next();
            var detailElement = detailRowElement.find('.detail-row-div');
            var sessionId = detailElement.data("sessionId");

            detailElement.empty();
            detailElement.load('/Admin/WebLogPartial/' + sessionId, function () {
                $.bootstrapSortable(true, 'reversed');
            });

            detailRowElement.show();
        });

    });
</script>

答案 1 :(得分:0)

任何依赖于加载HTML的东西都必须在回调函数中完成,因为AJAX中的第一个A代表异步

$("#2").click(function(){
    $(".jquery2").empty();
    $(".jquery2").load("jqueryEx.html", function() {
        var jquery2 =  $(".jquery2");
        $(".imagearea").html(jquery2);
        $(".jquery2").show(1000);
        $(".title").text("Extending Jquery Example");
    });
});

我不确定你要用.html(jquery2)做什么,因为.html()的参数应该是一个字符串,而不是一个jQuery对象。也许你的意思是:

var jquery2 = $(".jquery2").html();