jquery css不会与ajax一起工作

我正在制作一个来自ajax的列表，该部分工作得很好。我也检查sreenwidth并相应地改变一些我的div的宽度，但不能得到，当我使用AJAX它的工作...jquery css不会与ajax一起工作

这里是我做的：

$(document).ready(function(){ 

    var screenwidth = $(window).width(); 
    swidth = screenwidth - 20; 

    $("#thelist li").css("width", swidth+"px"); 

    $.getJSON('linktomyphppage.php', function(data) { 

     var array = []; 

     $.each(data, function (i, val){ 

      array.push($("#thelist").append("<li>"+val.fname+" "+val.lname+"</li>")); 

     }); 

    }); 

});

我的JSON的样子这个：

[{"fname":"Peter","lname":"Hanson"},{"fname":"Michael","lname":"Bird"}]

json部分工作得很好，但它就像它根本没有得到CSS部分。如果我这样做，这样它的工作原理，但我不使用JSON：

for (var i = 0; i < 2; i++) { 

    array.push($("#thelist").append("<li>"+val.fname+" "+val.lname+"</li>")); 

}

盼望的帮助，在此先感谢:-)

来源

2013-07-14 Mansa

我想这是因为你在创建之前使用'#thelist li'只需改变jQuery CSS的位置并将它放在最后.. – Bhavik

你能用一个例子来构建一个JsFiddle吗？具有swidth的console.log显示什么？也许你没有从swidth得到有效的回应？并且你也应该''var varidth'''也不认为这是问题 – alonisser

'css（）'将'style'属性添加到元素中，所以新元素不会拥有它。只需将css部分移至json请求回调的末尾即可。 –

为了避免设置的时间依赖性通过脚本的CSS，只是定义一个规则：

#thelist li { 
    position: relative; 
    right: 20px; 
}

一般情况下，它更最好只写CSS，而不是试图动态地建立并撒上命令插入它在你的代码。在理想的情况下，脚本除了添加/删除类外什么也不做。

来源

2013-07-15 03:10:44

试试这个;

$(document).ready(function(){ 
    var screenwidth = $(window).width(); 
    swidth = screenwidth - 20; 

    $.getJSON('linktomyphppage.php', function(data) { 
     var array = [] 
      html = ''; 

     $.each(data, function (i, val){ 
      html += "<li style='width:"+ swidth +"px;'>"+val.fname+" "+val.lname+"</li>"; 
     } 

     $("#thelist").append(html); 
    }); 
});

你应该在它已经创建的样式设置为li。

做一个单一的append是一个很好的做法，因为多个DOM操作相对较慢且资源密集度较高。

来源

2013-07-15 07:49:50 Pratheep

jquery css不会与ajax一起工作

回答

相关问题