0

所以我有一个网站，我正在开发一个使用 jQuery 和 jQuery UI 的个人网站

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

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

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

废话不多说，这是我的代码。#1 有效，#2 仅在第一次点击时有效。之后每次都将图像区域留空。

$(".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 加载到这里，并通过隐藏在我的 javascript 中的其他地方， $(".hidden").hide(); 然后通过加载到 imagearea 中.html() 并通过显示.show()

      <div class="jquery2 hidden">

      </div>

我的另一个 div 看起来像这样，通过单击 #1 将其放入 imagearea

    <div class="jscode hidden">
       <div class="block">

//大量的js代码转义到html中

        </div> <!-- end of block-->    
     </div>

一开始在我的 JS 代码的其他地方，我必须var js=$(".jscode");将它加载到您之前看到的 js 变量中。

如果您想查看我正在处理的过时示例，请访问 www.3realsoft.com（只有 cs 和 js 用于技能）

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

4

2 回答 2

1

当我试图让一个按钮同时加载和刷新内容时，我在搜索结果中找到了这个项目，并且加载工作但刷新不起作用。

这是解决方案的较短版本，将 Cache 设置为 false 是关键。 解决方案在这个其他链接上找到，但我在这里发布这个概念，因为如果谷歌把我放在这个项目中，其他寻找相同的人也可能会在这里找到自己。给约翰·米利金的道具，请确保转到他的答案并支持他： 停止缓存 jQuery .load 响应

<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>
于 2015-03-06T15:14:50.583 回答
0

任何依赖于正在加载的 HTML 的事情都必须在回调函数中完成，因为 AJAX 中的第一个 A 代表asynchronous。

$("#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)，因为 to 的参数.html()应该是一个字符串，而不是一个 jQuery 对象。也许你的意思是：

var jquery2 = $(".jquery2").html();
于 2013-09-21T14:24:41.277 回答