Question

我正在编写一些代码来通过Ajax调用服务器来生成锚元素。该列表已成功生成。但当我试图通过它的类选择锚元素时，我什么也没找到。我的代码有问题吗？有什么建议？我感谢您的所有反馈。感谢

这是我的代码

$(document).ready(function(){
  generate_link('somelink.php', '#link ul');

  $(".mylink").css("border","3px solid red"); //this is not works :-(

});   

function generate_link(method_url, target)
{

        $.ajax({
          type: 'GET',
          url: method_url,
          dataType: 'json',
          success: function(data) {
             var str='';
             for(i=0;i<data.length;i++){
                str = str + ('<li><a href="' + data[i]['anchor'] +'" class="mylink"></li>');
                   }
             $(target).html(str);
          } 
        });
}

Answer 1

在您的代码运行时，页面上不存在链接。

选择success来电的$.ajax()回调中的元素。

Answer 2

将此行移至回调函数

$(".mylink").css("border","3px solid red"); //this is not works :-(

Jquery正在发出Ajax请求，然后，还没有收到响应，立即执行上面的行。此时，尚未创建链接。

因此，您的AJAX调用应该看起来像

function generate_link(method_url, target)
{
    $.ajax({
      type: 'GET',
      url: method_url,
      dataType: 'json',
      success: function(data) {
         var str='';
         for(i=0;i<data.length;i++){
            str = str + ('<li><a href="' + data[i]['anchor'] +'" class="mylink"></li>');
               }
         $(target).html(str);
         $(".mylink").css("border","3px solid red"); //added this here
      } 
    });

}

Answer 3

由于在加载页面时应用CSS而不是在执行AJAX调用时应用CSS，因此CSS不会应用于使用AJAX添加的元素。尝试将设置边框的行移动到3px纯红色到success回调，如下所示：

$(document).ready(function(){
  generate_link('somelink.php', '#link ul');
});   

function generate_link(method_url, target)
{

        $.ajax({
          type: 'GET',
          url: method_url,
          dataType: 'json',
          success: function(data) {
             var str='';
             for(i=0;i<data.length;i++){
                str = str + ('<li><a href="' + data[i]['anchor'] +'" class="mylink"></li>');
                   }
             $(target).html(str);
             $(".mylink").css("border","3px solid red"); 
          } 
        });
}

我希望这会有所帮助。

jQuery：无法选择动态生成的锚元素

3 个答案: