Question

这对我来说是从我网站上的其他页面获取数据并附加到newDiv

    $.get('www.mysite.com', function (data) {
      $(data).find('#DIV1').appendTo('#NEWDIV');
    });

    <div id="NEWDIV"></div>

但我想设置2个链接并获取点击数据，我已经阅读了一些内容，但对于如何使其工作非常困惑。我想设置2个链接，然后单击它们并将数据附加到newDiv，同时删除当前数据。我假设我需要2个get函数，因为每个链接的数据来自另一个页面。

<div class="getdatalinks">
  <li class="getdiv1"><a>GET DIV1 APPEND TO NEWDIV</a></li>
  <li class="getdiv2"><a>GET DIV2 APPEND TO NEWDIV</a></li>
</div>

Answer 1

这应该有效：

<div class="getdatalinks">
  <li class="getdiv1"><a class='getLink' data-div="div1" data-url="site1.com">GET DIV1 APPEND TO NEWDIV</a></li>
  <li class="getdiv2"><a class='getLink' data-div="div2" data-url="site2.com">GET DIV2 APPEND TO NEWDIV</a></li>
</div>

然后把它连接起来：

$(function(){
     $("a.getLink").on("click",function(){
         var url=$(this).data("url"), dv="#"+$(this).data("div");
         $.get(url, function (data) {
            $("#NEWDIV").find(dv).remove();
            $(data).find(dv).appendTo('#NEWDIV');
         });
    });
});

data-url会从url获取数据，data-div会在返回的数据中找到div的ID。

Answer 2

可以使用load（）

简化ajax

<div class="getdatalinks">
  <li class="getdiv1"><a href="url1.php" data-content="#div1">GET DIV1 APPEND TO NEWDIV</a></li>
  <li class="getdiv2"><a  href="url1.php" data-content="#div1">GET DIV2 APPEND TO NEWDIV</a></li>
</div>

JS

$('.getdatalinks a').click(function(e){
    e.preventDefault();
    $('#newDiv').load(this.href +' '+ $(this).data('content') );        
});

load()允许在网址中设置空格分隔符选择器，然后从新内容中获取该文档片段

如何使用包含2个不同网址的2个链接获取点击数据

2 个答案: