ajax获取数据库名称加src地址，如何前台输出li标签并附带超链接？
```html
常规前台写法，li标签里包含a标签实现：
<li>
<a onclick="xadmin.open('张三','./file/a.pdf','','',true)">
</li>
<li>
<a onclick="xadmin.open('李四','./file/b.pdf','','',true)">
</li>
如何通过ajax动态实现？下面可以动态输出li标签了，如何让li标签有address超链接onclick="xadmin.open。
<span>
<p class="navi_title">清单</p>
<ul class="list">
</ul>
</span>
<script language="JavaScript">
$.ajax({
url:"./ajax_list.php",
type: "GET",
datatype:"json",
success:function(res){
var html='';
for(var i=0;i<res.length;i++){
html+="<li data-id="+res[i].id+">"+res[i].shortname+"</li>"
};
$(".list").html(html)
}
});
</script>
json数据格式
```html
[{"shortname":"张三","address":"./file/a.pdf"},{"shortname":"李四","address":"./file/b.pdf"}]
<span>
<p class="navi_title">清单</p>
<ul class="list">
</ul>
</span>
<script language="JavaScript">
$.ajax({
url: "./ajax_list.php",
type: "GET",
datatype: "json",
success: function(res) {
var html = '';
for (var i = 0; i < res.length; i++) {
html += `<li data-id="${res[i].id}">
<a href="${res[i].address}" onclick="xadmin.open('${res[i].shortname}','${res[i].address}','','',true)">
${res[i].shortname}
</a>
</li>`;
}
$(".list").html(html);
}
});
</script>
该回答引用chatgpt:
<script language="JavaScript">
$.ajax({
url: "./ajax_list.php",
type: "GET",
datatype: "json",
success: function (res) {
var html = '';
for (var i = 0; i < res.length; i++) {
html += '<li data-id="' + res[i].id + '"><a onclick="xadmin.open(\'' + res[i].shortname + '\', \'./file/' + res[i].filename + '\', \'\', \'\', true)">' + res[i].shortname + '</a></li>';
}
$(".list").html(html);
}
});
</script>
【以下回答由 GPT 生成】
问题解决方案:
为了实现通过AJAX动态输出带超链接的li标签，并且每个li标签都具有onclick事件，您可以进行以下步骤:
```html
```
javascript $.ajax({ url: "./ajax_list.php", type: "GET", datatype: "json", success: function (res) { var html = ''; for (var i = 0; i < res.length; i++) { var link = '<a href="#" onclick="xadmin.open(\'' + res[i].name + '\', \'' + res[i].file + '\', \'\', \'\', true)">' + res[i].name + '</a>'; html += '<li data-id="' + res[i].id + '">' + link + '</li>'; } $(".list").html(html); } });
在上述代码中，我们首先创建一个link变量来存储超链接的HTML代码。该代码使用xadmin.open函数中的res[i].name和res[i].file来动态生成超链接的文本内容和目标文件路径。然后，我们将link变量添加到每个li标签中，并设置onclick事件。
注意: 只需将res[i].name和res[i].file替换为您在响应数据中使用的名称和文件路径。
```html
清单
```
注意: 确保页面中有一个具有class属性为list的ul元素，该元素作为目标将被替换为动态生成的li标签。
重新运行您的代码后，您将获得一个带有超链接和onclick事件的动态生成的li标签列表。
希望这可以帮助您解决问题。如果您还有任何疑问，请随时提问。
【相关推荐】