yii2引入js先后顺序的问题？ - 问答

小程府 2016-06-21 10:38:41 12620次浏览 7条回答 9 悬赏 10 金钱

yii2引入js先后顺序的问题？yii2在引入公共js的时候，可以在资源包配置中，引入

class AppAsset extends AssetBundle
{
    public $basePath = '@webroot';
    public $baseUrl = '@static';
    public $js = [
        'js/jquery-1.10.2.js',
        'js/bootstrap.min.js',
        'js/plugins/metisMenu/jquery.metisMenu.js',
        'js/plugins/slimscroll/jquery.slimscroll.min.js',
        'js/hplus.js',
        'js/plugins/pace/pace.min.js',
        'js/jquery.qrcode.min.js'
    ];
    public $css = [
        'css/bootstrap.min.css',
        'font/font-awesome.css?v=4.3.0',
        'css/plugins/morris/morris-0.4.3.min.css',
        'js/plugins/gritter/jquery.gritter.css',
        'css/animate.css',
        'css/style.css'
    ];

但是这样引入会，在页面中，为什么是最后加载js呢，在html的最后

<script src="http://.cn/js/jquery-1.10.2.js" 0="business\assets\AppAsset"></script>
<script src="http://.cn/js/bootstrap.min.js"></script>
<script src="http://.cn/js/plugins/metisMenu/jquery.metisMenu.js"></script>
<script src="http://.cn/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
<script src="http://.cn/js/hplus.js"></script>
<script src="http://.cn/js/plugins/pace/pace.min.js"></script>
<script src="http://.cn/js/jquery.qrcode.min.js"></script></body>
</html>

如何把js放到html的开始，或者头部中呢？

zhoupenghui 回答于 2016-06-21 11:58 举报
js的放置位置默认在html结尾,可以在AppAsset中设置:
```
/**
     * @inheritdoc
     */
    public $jsOptions = [
        'position' => View::POS_HEAD,
    ];  // 这是设置所有js放置的位置
```
也可以在视图中单独设置js文件的放置位置,eg:
```
$this->registerJsFile('js/ware/detail.js', ['depends' => ['frontend\assets\AppAsset'], 'position' => $this::POS_HEAD]);
```
共 2 条回复

小程府回复于 2016-06-21 18:33 回复

我再问一下，你这个'position' => View::POS_HEAD,中的view，是引的哪里的，use xxx？

小程府回复于 2016-06-21 18:38 回复

知道了，use yii\web\View; 谢谢你哈

zxcasdqwe 觉得很赞

回复 1 0

八宝粥回答于 2016-06-22 09:17 举报

<script>
<?php $this->beginBlock('js_end') ?>  
$(document).ready(function(){

    $("#demo").click(function(){
        ......
    });

});
<?php $this->endBlock() ?>
</script>
<?php $this->registerJs($this->blocks['js_end'], \yii\web\View::POS_END); ?>

晗痴觉得很赞

yidashi 回答于 2016-06-23 21:20 举报

一楼正解。当然你也可以这样

public $js = [
        ['js/jquery-1.10.2.js', 'position' => View::POS_HEAD],
        ['js/bootstrap.min.js', 'position' => View::POS_HEAD],
        'js/plugins/metisMenu/jquery.metisMenu.js',
        'js/plugins/slimscroll/jquery.slimscroll.min.js',
        'js/hplus.js',
        'js/plugins/pace/pace.min.js',
        'js/jquery.qrcode.min.js'
    ];

单独让jquery和bootstrap在头部加载，其他的在底部~

Holle word , 不求而得的往往求而不得 , 小程府觉得很赞