从动态创建的锚点中获取href

时间:2018-03-05 22:13:58

标签: javascript jquery

我无法获得锚点的href链接。我在jquery中以循环方式动态创建元素。请帮我解决如何获取链接地址的问题。

function setGrid(){
//  get List of all Avatars...
    var arr = ['MMA','MMB','MMC','MMD','MME','MMF','MMG','MWA','MWB','MWC','MWD','MWE','MWF','MWG'];
    for(var i=0;i<arr.length;i++)
    {                                                                     
        var d = "<a  class='testClick' href='../../images/avatars/"+arr[i]+".png'>"+                                   
        "<img  src='../../images/avatars/"+
        arr[i]+".png' id='"+arr[i]+"' alt='avatar' style='height:120px;width:120px; margin-left:10px'></a>";
        $( "div.modal-body" ).append( d );
    }
}

以下是我尝试使用onclick侦听器访问该链接的方式:

$(document).ready(function(){   
    $(".testClick").click(function () {
        var value = $(this).attr('href');
        alert(value );
    });
});`

我无法获得href。请帮帮我。

1 个答案:

答案 0 :(得分:2)

您的上述代码正常;它会正确警告href属性。

您唯一缺少的是阻止实际带您进入该链接的点击。这可以通过将e传递到.click()的{​​{1}}函数,然后调用 e.preventDefault() 来阻止默认点击行为来完成:

.testClick
function setGrid() {
  //  get List of all Avatars...
  var arr = ['MMA', 'MMB', 'MMC', 'MMD', 'MME', 'MMF', 'MMG', 'MWA', 'MWB', 'MWC', 'MWD', 'MWE', 'MWF', 'MWG'];
  for (var i = 0; i < arr.length; i++) {
    var d = "<a class='testClick' href='../../images/avatars/" + arr[i] + ".png'>" +
      "<img  src='../../images/avatars/" +
      arr[i] + ".png' id='" + arr[i] + "' alt='avatar' style='height:120px;width:120px; margin-left:10px'></a>";
    $("body").append(d);
  }
}

setGrid();

$(document).ready(function() {
  $(".testClick").click(function(e) {
    e.preventDefault();
    var value = $(this).attr('href');
    alert(value);
  });
});