等到动态添加CSS文件加载后再执行操作

Question

我使用此代码动态加载外部css文件，但是我想等到css加载后再执行其他操作，例如显示一些HTML。

$(document).on('click', '#game', function(e){   
    $('<link rel="stylesheet" type="text/css" href="'+myStylesLocation+'" >')
       .appendTo("head");
});

我该怎么做？

Answer 1

您可以使用原始$.ajax。

$.ajax({
    url: myStylesLocation,
    beforeSend: function() {
       // start animation
    }
    success: function(data) {
       $('<style type="text/css">' + data + '</style>').appendTo("head"); // append CSS
       // end animation
    }
});