Javascript 在Yii2框架中实现向导（jquery.steps）

我想在我的应用程序中实现一个向导（带表单）。因此，我想使用jquery.steps（您可以在这里找到）

我已经创建了一个包含正确js文件的assetbundle

namespace app\assets;

use yii\web\AssetBundle;


class WizardAsset extends AssetBundle
{
public $basePath = '@webroot';
public $baseUrl = '@web';
public $css = [
    'css/site.css',
    'css/smart_wizard.css',
    'css/jquery.steps.css',
];
public $js = [
    'js/jquery.steps.min.js',
];

public $depends = [
    'yii\web\YiiAsset',
    'yii\bootstrap\BootstrapAsset',
];
}

并且在我看来有以下代码：

<?php
use app\assets\WizardAsset;
WizardAsset::register($this);
?>

<div id="example-basic">
    <h3>Keyboard</h3>
    <section>
        <p>Try the keyboard navigation by clicking arrow left or right!</p>
    </section>
    <h3>Effects</h3>
    <section>
        <p>Wonderful transition effects.</p>
    </section>
    <h3>Pager</h3>
    <section>
        <p>The next and previous buttons help you to navigate through your content.</p>
    </section>
</div>

<script>
$("#example-basic").steps({
    headerTag: "h3",
    bodyTag: "section",
    transitionEffect: "slideLeft",
    autoFocus: true
});
</script> 

键盘
通过单击向左或向右箭头尝试键盘导航

影响
奇妙的过渡效果

传呼机
“下一步”和“上一步”按钮可帮助您浏览内容

$（“#示例基本”）。步骤({
头像：“h3”，
bodyTag:“节”，
过渡效果：“slideLeft”，
自动对焦：正确
});

但是，这似乎不起作用：我想javascript文件应该在html文件末尾的..之前加载，但是Yii强制在文件末尾加载脚本。有没有办法克服这个问题？或者我是否纠正了这个错误？

使用

<?php
$this->registerJs(<<<'EOD'
  $("#example-basic").steps({
    headerTag: "h3",
    bodyTag: "section",
    transitionEffect: "slideLeft",
    autoFocus: true
});
EOD
); ?>

---

而不是脚本标记。

您的浏览器是否出现任何js错误？您是否尝试过使用View:：registerJs（）对于您认为的内联js？我解决了这个问题，将我所有的javascript代码放入一个单独的文件中，并在jquery加载后加载。registerJs没有做这些操作。这里有一个Yi2扩展，它使用jquery智能向导库实现表单向导