Yii之CClientScript用法总结

Yii之CClientScript用法总结

Yii通过CClientScript管理Js和CSS，在开发过程中经常会遇到自定义的Js和Yii内置的Js冲突或者重复引入。

引入自己的JS文件

在framework/web/js/packages.php文件中定义了Yii内置的Js库，默认情况下Yii引入的Js文件都是通过packages.php文件引入的。例如使用Yii的JuiDialog创建一个对话框，其中引入的jquery和jquery-ui就是如此。即使在模板文件中直接引入自己的jquery文件，最后生成的文件中还是会引入内置的jquery文件，这就导致重复引入jquery文件。要想只引入自己的jquery文件可以通过以下步骤实现：

1）、在配置文件main.php的components中添加如下代码：

<span style="font-size:12px;">clientScript' => array(
    'packages' => array(
        'jquery' => array(
            'basePath' => 'webroot.js',  // basePath对应的值为“路径别名”
            'baseUrl'  => '/project/js', // baseUrl为相对于根路径的相对路径，并以“/”开头
            'js' => array('jquery.min.js'), // 具体文件名称
        ),
    ),
)</span>

其中“basePath”和“baseUrl”只要设置其中一个值就可以了，系统优先使用“baseUrl”。两者的区别是使用“bathPath”，Js文件会被复制到assets目录下，这和使用内置的Js文件类似。

2）、在Controller或者view文件中使用Yii::app()->clientScript->registerCoreScript('jquery')

其它用法

Yii::app()->clientScript->registerMetaTag('text/html;charset=UTF-8');
Yii::app()->clientScript->registerLinkTag('stylesheet', 'text/css', Yii::app()->request->baseUrl . '/css/bootstrap.min.css');
Yii::app()->clientScript->registerCss('#body', "body {font-size:12px;}\n#inputText {height: 32px; padding: 4px;}");
Yii::app()->clientScript->registerScript('#sc1', '$(function() { var obj, id, val; })', CClientScript::POS_END); // #sc1只是一个唯一标识符

Yii::app()->clientScript->registerScriptFile(Yii::app()->request->baseUrl . '/js/my.js', CClientScript::POS_END, array('id' => 'sdg'));
Yii::app()->clientScript->registerScriptFile(Yii::app()->theme->baseUrl . '/js/my.js');