Heim  >  Artikel  >  php教程  >  yii2.0 statische Ressource js CSS-Einführungsmethode

yii2.0 statische Ressource js CSS-Einführungsmethode

黄舟
黄舟Original
2017-01-03 09:36:292153Durchsuche

Ressourcenpaket konfigurieren:

Für die CSS/JS-Verwaltung verwendet Yii2 die Ressourcenpaketklasse AssetBundle.

Backend/assets/AppAsset.php öffnen

namespace backendassets; 
use yiiwebAssetBundle; 
class AppAsset extends AssetBundle { 
public $basePath = [email protected]/* */'; 
public $baseUrl = [email protected]/* */';
//全局CSS 
public $css = [ 
'css/animate.css', 
'css/style.min.css', 
]; 

//全局JS 
public $js = [ 
'js/jquery-2.1.1.js' 
]; 

//依赖关系 
public $depends = [ 
'yiiwebYiiAsset', 
'yiiootstrapBootstrapAsset', 
]; 

//定义按需加载JS方法,注意加载顺序在最后 
public static function addScript($view, $jsfile) { 
$view->registerJsFile($jsfile, [AppAsset::className(), 'depends' => 'backendassetsAppAsset']); 
} 

//定义按需加载css方法,注意加载顺序在最后 
public static function addCss($view, $cssfile) { 
$view->registerCssFile($cssfile, [AppAsset::className(), 'depends' => 'backendassetsAppAsset']); 
} 
 }

Statische Ressourcen werden in die Ansicht geladen

1 Layout) Globales CSS/JS verwenden

use yiihelpersHtml; 
use backendassetsAppAsset; 
use backendwidgetsAlert; 

AppAsset::register($this);

2. Separate Stile in die Ansicht laden

$cssString = ".gray-bg{color:red;}"; 
$this->registerCss($cssString);

3. Separate JS in die Ansicht laden

<?php$this->registerJs( 
&#39;$("document").ready(function(){ 
$("#login-form").validate({
errorElement : "small", 
errorClass : "error",
rules: {
"AgNav[nav_cn]": {
required: true,
},
},
messages:{
"AgNav[nav_cn]" : { 
required : "此字段不能为空.",
},
}
});
});&#39;
);?>

oder

<div id="mybutton">点我弹出OK</div> 

<?php $this->beginBlock(&#39;test&#39;) ?> 
$(function($) { 
$(&#39;#mybutton&#39;).click(function() { 
alert(&#39;OK&#39;); 
}); 
}); 
<?php $this->endBlock() ?> <?php $this->registerJs($this->blocks[&#39;test&#39;], yiiwebView::POS_END); ?>

4. JS/CSS-Dateien in die Ansicht einführen

Benutzerdefinierte Funktion

public static function addScript($view, $jsfile) { 
$view->registerJsFile($jsfile, [AppAsset::className(), &#39;depends&#39; => &#39;backendassetsAppAsset&#39;]); 
}
AppAsset::register($this); 
//只在该视图中使用非全局的jui 
AppAsset::addScript($this,[email protected]/* *//js/jquery-ui.custom.min.js&#39;); 
AppAsset::addCss($this,[email protected]/* *//css/font-awesome/css/font-awesome.min.css&#39;);

zum direkten Laden verwenden

AppAsset::register($this); 
//css定义一样 
$this->registerCssFile([email protected]/* *//css/font-awesome.min.css&#39;,[&#39;depends&#39;=>[&#39;backendassetsAppAsset&#39;]]); 
$this->registerJsFile([email protected]/* *//js/jquery-ui.custom.min.js&#39;,[&#39;depends&#39;=>[&#39;backendassetsAppAsset&#39;]]);

Das Obige ist der Inhalt der Einführungsmethode der statischen Ressource js css von yii2.0. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website (www.php.cn)!


Stellungnahme:
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