Question

好的，我知道有很多关于JQuery .attr的文章是未定义的，但是我一直找不到能解决甚至提示我这里问题的文章。

首先，我有一个Ajax请求，该请求可以如下填充ul。

$.each(msg,function(key, value){
            ul.append('<li class="fa fa-angle-right cnt-link"><a href="'+key+'">'+value+'</a></li>');
        })

效果很好，可以创建列表，并且href尝试转到由键值设置的不存在的页面。

尽管单击链接但我试图使用该href值进行另一个AJAX请求，但是由于某种原因，我无法从中获取值。

$('.cnt-link').click(function(event){
            event.preventDefault();
            var cnt = $(this).text();
            var cntId = $(this).attr('href');               
            console.log(cntId);
            console.log(cnt);
        })

将cnt变量设置得很好，所以我看不到$（this）没有引用正确的对象而是试图获取href返回未定义的问题。

我也尝试使用添加键值

ul.append('<li class="fa fa-angle-right cnt-link"><a href="#">'+value+'</a></li>').data("cntId", key);

并使用

从单击的项目中检索它

var cntId = $(this).data('cntId');

但这也返回未定义，因此让我开始考虑也许是因为$（this）没有选择正确的对象。

我为此付出了很大的努力，非常感谢任何能看到我犯下的愚蠢错误的人提供的信息：）

Answer 1

cnt-link是<li>，因此它没有href属性。如果您想将href放入使用代码创建的li内

ul.append('<li class="fa fa-angle-right cnt-link"><a href="'+key+'">'+value+'</a></li>');

然后，您可以选择a的子元素，而.cnt-link是this的子元素，而a将引用带有href的{{1}}：

$('.cnt-link > a').click(function(event){

或者，在.cnt-link上使用处理程序，首先选择.cnt-link的{{1}}进入.children：

<a>

$('.cnt-link').click(function(event){
  event.preventDefault();
  var cntId = $(this).children().attr('href');               
  console.log(cntId);
})

$('.cnt-link').click(function(event) {
  event.preventDefault();
  var cntId = $(this).children().attr('href');
  console.log(cntId);
})

$（this）.attr（'href'）返回未定义

1 个答案: