使用相同的ajax调用打开多个动态链接 [英] Open multiple dynamic links with the same ajax call

问题描述

我显示了多个使用相同的动态链接，ajaxloads第一个链接上的内容正常，但不适用于其余的内容。如何获得它加载其他链接的内容在同一个div？

Html：

  $ string。='< a id =hrefiddata-id ='。$ name [id]。'href =link >。$名称[ 名称]。 '< / A>'。 
< div id =content> < / DIV> 
  

Jquery：

（'click'，function（e）{
var load = $（e.target）.attr（href）。 ）;
if（load ==#link）{
$ .ajax（{
type：'post'，
url：/ page / test /+ id，
complete：function（event）{
$（＃content）。contents（）。remove（）;
$（＃content）。append（event.responseText ）;
}
}）;
}
}）;

解决方案

将id更改为类， if语句

  $ string。='< a class =hrefiddata-id ='。$ name [ id]。'href =link>'。$ name [name]。'< / a>'。 
< div class =content> < / DIV> $（'。hrefid'）。on（'click'，function（e）{
 var el = $（this）; 
 var load = $（e。目标）.attr（href）; 
 if（load ==link）{
 $ .ajax（{
 type：'post'，
 url： / page / test /+ id，
 success：function（event）{
 el.next（）。empty（）; 
 el.next（）。append（event.responseText） ; 
} 
}）; 
} 
}）; 
  

I am displaying multiple dynamic links which use the same , ajaxloads the content on the first link fine but doesn't work for the rest of them. How can I get it to load the content of other links in the same div?

Html:

$string .= '<a id="hrefid" data-id="'.$name["id"].'" href="link" >'.$name["name"].'</a>'.
<div id="content"> </div>

Jquery:

$('#hrefid').on('click', function (e) {
    var load = $(e.target).attr("href");
    if(load == "#link") {
        $.ajax({
            type: 'post',
            url: "/page/test/"+id,
            complete: function (event) {
                $("#content").contents().remove();
                $("#content").append(event.responseText);
            }
        });
    }
    });

解决方案

Change the id to a class, remove # from the if statement

$string .= '<a class="hrefid" data-id="'.$name["id"].'" href="link" >'.$name["name"].'</a>'.
<div class="content"> </div>

$('.hrefid').on('click', function (e) {
    var el = $(this);
    var load = $(e.target).attr("href");
    if(load == "link") {
        $.ajax({
            type: 'post',
            url: "/page/test/"+id,
            success: function (event) {
                el.next().empty();
                el.next().append(event.responseText);
            }
        });
    }
    });

这篇关于使用相同的ajax调用打开多个动态链接的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！