Question

需要使用JQuery和AJax的基本帮助。我有一个ul

  <div id="topics">

<h1><a href="index.html">JQuery</a></h1>
  <h3>A Working Primer</h3>

<ul>
    <li><a href="articles/includingJQuery.html">Including JQuery</a></li>
    <li><a href="articles/tools.html">Tools of the Trade</a></li>
</ul>
  </div>

一个空div，我喜欢在上面的同一页面上加载Ajax内容：

  <div id="articles">
  </div>

和我的剧本

$(document).ready(function(){
  $("#topics ul li a").click(function(){
 $('#articles').load('');

 return false; 
   });
});

不完全确定要在负载中放入什么以及它的动态。任何帮助表示赞赏：）

Answer 1

如果内容位于href属性位置，则需要获取该属性的值：

$('#articles').load(this.href);

所以试试这个：

$(document).ready(function(){
    $("#topics ul li a").click(function() {
              // use the content of the href attribute
              //     for the load parameter
        $('#articles').load(this.href);
        return false; 
    });
});

Answer 2

$('#articles').load($(this).attr('href'));

试试....

Answer 3

使用

$('#articles').load($(this).attr('href'));

会模糊地工作，但是你最终会加载整个远程文档，包括重复的头部/身体标记。

为了变得更复杂，您可以在.load（）中指定一个回调函数，并使用它来读取返回的内容，只收集<body>元素的子元素，并将这些子元素插入到您的{{ 1}}元素。

Answer 4

这听起来像你正在寻找...以下函数调用ASP.Net Webservice。然后，我使用从Webservice返回的JSON数据将html附加到我的元素。我想你可以从这个例子中看到我正在做什么并将它应用到你自己的代码中。如果您需要我澄清任何事情，请告诉我。

$(function () {
    $.ajax({
        type: "POST",
        data: "{}",
        datatype: "json",
        url: "../webServices/myTestWS.asmx/testMethodTV",
        contentType: "application/json; charset-utf-8",
        success: function (msg) {
            var len = msg.d.rows.length;
            $('#sidetree').append('<ul id="treeview">');
            for (i = 0; i < len; i++) {
                $('#sidetree').append("<li><span class='expandable'>" + msg.d.rows[i].data + "</span></li>");
            }
            $('#sidetree').append('</ul>');

    });
});

Answer 5

您必须将每个包含的页面构造成具有相同的div名称，例如#container，其中您要加载到#articles div中的数据位于其中。然后你可以简单地做：

$(document).ready(function() {
  $("#topics ul li a").click(function() {
    var url = $(this).attr('href');
    $('#articles').load(url + ' #container');
    return false; 
  });
});

这只会获取#container div并排除你不想要的所有额外的html / body标签，而且你不必处理回调函数。见http://api.jquery.com/load/

基本的JQuery帮助

5 个答案: