Question

为什么调整大小在此函数中起作用而在下面的函数中不起作用。这对我来说很重要，因为每次点击id为#test的div时，我都希望检索数据，而不是只检索一次（工作示例）。

感谢。

WORKS

$(document).ready( function() {
  $("#tc").load("berichten.php");
  $("#tc").draggable();
  $("#test").click( function(){
    $("#tc").toggle(); //.css("display","inline-block");
    $("#tc").resizable();
  });
});

不工作!!! ：

$(document).ready(function() {
  $("#tc").draggable();
  $("#test").click(function(){
    $("#tc").load("berichten.php");
    $("#tc").toggle(); //.css("display","inline-block");
    $("#tc").resizable();
  });
});

Answer 1

$("#tc").load("berichten.php", function(){
    $("#tc").toggle(); //.css("display","inline-block");
    $("#tc").resizable();
});

利用.load()的回调函数仅在请求完成后才响应。

Answer 2

我唯一能想到的是点击链接的默认操作会取消加载。尝试：

$("#test").click( function( e ) {
  e.preventDefault();
  $("#tc").load("berichten.php");
  $("#tc").toggle(); //.css("display","inline-block");
  $("#tc").resizable();
});

Answer 3

尝试：

$(document).ready(function() {
  $("#tc").draggable();
  $(document).on("click","#test",function(){
    $("#tc").load("berichten.php");
    $("#tc").toggle(); //.css("display","inline-block");
    $("#tc").resizable();
  });
});

Answer 4

尝试使用AJAX加载数据，如下所示：

$(document).ready(function() {
    var el = $('#tc');
    el.draggable();
    var AjaxRequest = null;
    $("#test").click(function() {
        if (AjaxRequest !== null) {
            AjaxRequest.abort();
        }
        AjaxRequest = $.get('berichten.php', function(data) {
            el.html(data);
            el.toggle(); //.css("display","inline-block");
            el.resizable();
        });
    });
});

Jquery .load / .resizable无法正常工作

4 个答案: