2016-01-27 23 views
1

我有一个简单的ajax调用返回一些json,它工作正常,但是我很努力地选择jQuery以后的元素。这是因为它们装载ajax的方式?使用jquery通过ajax在json中定位数据标签

在这个阶段,所有我想要做的是警报的数据元素的数据票'

<div id="list-latest" class="pagelist"></div> 
<script> 
$(function() 
    { 
    $.ajax({          
    url: 'http://example.com/go.php',     
    data: "",       
    dataType: 'json',     
    success: function(data)   
     { 
     var $grouplist = $('#list-latest'); 
     $.each(data, function() { 

      $('<div class="tile-item"><a href="javascript:void(0);" onclick="alertme();" class="allinfo" data-votes="' + this.votes + '" data-views="' + this.Views '" >link</a></div>').appendTo($grouplist); 

     }); 
     } 

     }); 


    }); 

<script type='text/javascript'> 
    function alertme(){ 
    alert($(this).attr("#data-votes")); 
    } 
</script> 

的内容之一是它与如何做我试图选择(这个)? 在它只是返回的那一刻“未定义”

感谢

回答

0

问题是因为thisalertme()函数引用是window,而不是其提高了点击事件的元素。您需要将参考作为参数传递给函数。还要注意检索data属性的语法稍微偏离。试试这个:

$('<div class="tile-item"><a href="javascript:void(0);" onclick="alertme(this);" class="allinfo" data-votes="' + this.votes + '" data-views="' + this.Views '" >link</a></div>').appendTo($grouplist); 
function alertme(el){ 
    alert($(el).data("votes")); 
} 

应当指出的是,这是更好的做法挂钩使用Javascript的事件。在这种情况下,您需要一个委托事件处理程序,因为所讨论的元素在加载后会动态地附加到DOM。这种方法将意味着处理器this引用引用引发该事件的元素。试试这个:

$(function() { 
    $.ajax({          
     url: 'http://example.com/go.php',     
     data: "",       
     dataType: 'json',     
     success: function(data) { 
      var $grouplist = $('#list-latest'); 
      $.each(data, function() { 
       $('<div class="tile-item"><a href="#" class="allinfo" data-votes="' + this.votes + '" data-views="' + this.Views '">link</a></div>').appendTo($grouplist); 
      }); 
     }); 
    } 

    $grouplist.on('click', '.allinfo', function(e) { 
     e.preventDefault(); 
     alert($(this).data("votes")); 
    }); 
});