Question

我正在尝试将CSS文件附加到当前的HTML页面，如下所示：

    var css = jQuery("<link>");
    css.attr({
      rel:  "stylesheet",
      type: "text/css",
      href: "http://domain.com/chron/css/jquery.gritter.css"
    });
    $("head").append(css);

一旦下载了css文件，我想调用一个特定的函数。我想我会把函数调用放在$('head').append(css);行之后，但不确定这是否能保证在调用函数之前首先下载css文件。有人可以告诉我怎么做吗？

Answer 1

如何通过AJAX检索并将其放在STYLE元素中：

$.ajax( {
    url: 'http://domain.com/chron/css/jquery.gritter.css'
    dataType: 'text'
    success: function( data )
    {
        $( '<style>' )
            .attr( 'type', 'text/css' )
            .text( data )
            .appendTo( 'head' );

        yourFunction();
    }
} );

Answer 2

好。标记应该具有名为complete的属性，在加载时设置为true。如果你想要或者onload可以工作，你可以每50毫秒测试一次。

E.g。

var css = jQuery("<link>");
css.attr({
  rel:  "stylesheet",
  type: "text/css",
  href: "http://domain.com/chron/css/jquery.gritter.css"
})
.load(function() { /* callback */ });
$("head").append(css);

//As i have no idea whether the onload event
//works on link elements or not, try this instead:
setTimeout(function(){
    if(!css.complete)
    { setTimeout(arguments.callee, 50); }
    else
    { /* callback */ }
}, 50);

jQuery附加CSS并运行一个函数？

2 个答案: