Question

我正在尝试在jsfiddle.net上测试加载AJAX响应，似乎无法弄清楚如何做到这一点。

我正在呼叫.load('/echo/html')，但我不确定如何传递数据？

JS：

$(function() {
    $("div.post-big").hide();

    $("div.expand").click(function() {
    $(this).parent().hide();
    $(this).parents('.post').load('/echo/html/');        
  });
});

支持HTML：

<div class="post">
  <div class="post-small">
    <div>Title</div>
    <div>Content</div>
    <div class="expand">expand</div>
  </div>
  <div class="post-big"></div>
</div>

<div class="post">
  <div class="post-small">
    <div>Title</div>
    <div>Content</div>
    <div class="expand">expand</div>
  </div>
  <div class="post-big"></div>
</div>

<div class="post">
  <div class="post-small">
    <div>Title</div>
    <div>Content</div>
    <div class="expand">expand</div>
  </div>
  <div class="post-big"></div>
</div>

支持CSS：

.post {
    border: 1px solid #911;
    margin: 5px;
}

Answer 1

您需要为.load方法提供第二个参数，并使用html属性。

.load('/echo/html/', { html: 'Hello!' });

请参阅jsfiddle

上的工作示例

在此演示中，单击显示expand的文本以触发加载。

Answer 2

您可以做的最好的事情是找到一个对象，您想要附加只是触发ajax调用函数的代码。比如说

 $('button').click(function(){
      //do your ajax call here 
 });

如何将jQuery .load方法与jsfiddle echo功能一起使用？

2 个答案: