Heim > Web-Frontend > js-Tutorial > Hauptteil

Bestimmen Sie automatisch, ob CSS- oder JS-Dateien zur Seite hinzugefügt werden sollen, nachdem CSS geladen wurde_jquery

WBOY
Freigeben: 2016-05-16 16:36:40
Original
1219 Leute haben es durchsucht

Ich schreibe gerade das Projekt-Framework und schreibe eine JQueryMessageBox-Klasse, um die Dialog() in der JQuery-Benutzeroberfläche zum Anzeigen des Meldungsfelds zu verwenden. Um den Aufruf der Methode zu vereinfachen, habe ich eine automatische Beurteilung hinzugefügt, ob die Seite hinzugefügt wurde ui.js und ui .css, der Code lautet wie folgt:

//如果没有包含ui.js,则引用 
if ($('script[src$=""jquery-ui-1.8.11.custom.min.js""]').length == 0) {{ 
$(""<script src='/js/jquery-ui-1.8.11.custom.min.js' type='text/javascript' />"").appendTo('head'); 
}} 
//如果没有加载css,则加载 
if ($('link[ref$=""jquery-ui-1.8.14.custom.css""]').length == 0) {{ 
$('<link href=""/css/jquery-ui-1.8.14.custom.css"" rel=""stylesheet"" type=""text/css"" />').appendTo('head'); 

//dialog() script 
}}
Nach dem Login kopieren

Der CSS-Code wird jedoch nicht sofort geladen, sodass beim Anzeigen des Dialogfelds kein Stil angezeigt wird (dies ist unter IE9 in Ordnung, da unter IE9 die Seitenelemente neu gezeichnet werden, selbst wenn das CSS später heruntergeladen wird). (während IE8 dies nicht tut). Um dieses Problem zu lösen, können Sie Ajax verwenden. Nachdem das CSS geladen wurde, wird der Code wie folgt angezeigt

if ($('link[ref$=""jquery-ui-1.8.14.custom.css""]').length == 0) { 
$.ajax({ 
url: '/css/jquery-ui-1.8.14.custom.css', 
success: function(data) { 
//创建一个style元素,并追加到head中 
//替换其中images的路径 
$('<style type="text/css">' + data.replace(/url\(images/g, 'url(/css/images') + '</style>').appendTo('head'); 
//dialog() script; 
} 
}); 
} 
else { 
//dialog() script; 
}
Nach dem Login kopieren
Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage