Yii2-在控制台中获取类型和引用错误

Yii2-getting type and reference errors in console

我正在研究 Yii2。在我的控制台中,我收到两种类型的错误。

  1. Uncaught TypeError: Cannot read property 'fn' of undefined at bootstrap-show-password.min.js:6 at bootstrap-show-password.min.js:6

错误行 bootstrap-show-passwordvar i=e.fn.password;e.fn.password=function()......}(window.jQuery);

  1. Uncaught ReferenceError: $st is not defined at common.js:263

错误行 commonif ($st && $stats && blockingRules && setupUser && !window.forceReload)..

下面是我在 main.php 文件中的声明

<?php $this->beginPage() ?>
<!DOCTYPE html>
<html lang="<?= Yii::$app->language ?>">
<head>
<meta charset="<?= Yii::$app->charset ?>">
<meta name="viewport" content="width=device-width, initial-scale=1">
<?= Html::csrfMetaTags() ?>
<title><?= Html::encode($this->title) ?></title>
<?php $this->head() ?>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css">
<!-- Ionicons -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-show-password/1.0.3/bootstrap-show-password.min.js"></script>
</head>
<body class="hold-transition skin-blue sidebar-mini">
<?php $this->beginBody() ?>

更新 1

我的一些脚本 main.php

<script>
$(document).ready(function () {
    $('.listing-img').on('click', function () {
        $('#modal-img-tag').attr('src', $(this).attr('src'));
        $('#image-view-modal').modal();
    });
});
</script>
<script>
var data = [];
<?php foreach(\app\models\Roles::toArrayList() as $k=>$v){?>
data.push({id:<?=$k?>, text: '<?=$v?>'});
<?php } ?>
if($(".select2-selection").length>0) {
    $(".select2-selection").select2({
        data: data,
        allowClear: true,
        placeholder: "Select a Role",
        multiple: true
    });
}
</script>
<script src="https://cdn.rawgit.com/MrRio/jsPDF/master/dist/jspdf.min.js"> 
</script>
<div id="pdf-editor"></div>
</body>
</html>
<?php $this->endPage() ?>

我已经为 yii2/yii 搜索了这两个,但我找不到任何合适的解决方案

我怎样才能摆脱这些错误?

非常感谢任何帮助。

在您的布局文件中,您使用 <script> 标签包含了 bootstrap-show-password.js 文件。

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-show-password/1.0.3/bootstrap-show-password.min.js"></script>

并且也在 <head> 部分内,而默认情况下,如果您使用 AssetManagerregisterJsFile,它会将脚本添加到页面底部 [=18= 之前]标签,bootstrap-show-password.js应该在jquerybootstrapjs库之后加载,而不是在它之前加载,见下面bootstrap-show-password[=27=的演示序列]

 <script src="assets/jquery.min.js"></script>
 <script src="assets/bootstrap-v2/js/bootstrap.js"></script>
 <script src="bootstrap-show-password.js"></script>

这就是您收到错误的原因

Uncaught TypeError: Cannot read property 'fn' of undefined at bootstrap-show-password.min.js:6 at bootstrap-show-password.min.js:6

您的 jquery 和 bootstrap 正在加载到页面底部而不是头部。

您应该将脚本标记替换为

$this->registerJsFile('https://cdnjs.cloudflare.com/ajax/libs/bootstrap-show-password/1.1.2/bootstrap-show-password.min.js',[
    'depends'=> \yii\bootstrap\BootstrapAsset::class
]);

以便在 bootstrap 和 jquery 库之后加载文件。

关于另一个错误

Uncaught ReferenceError: $st is not defined at common.js:263

它与安装在您的 chrome 浏览器中的某些扩展有关,查看您提供的 link 搜索具有该名称的 chrome 扩展,您可以尝试使用任何其他扩展像 FF 或 IE 这样的浏览器作为演示 url 在使用 chrome 时不会为我加载该特定脚本,文件 common.js 也没有包含在布局中的任何位置或 AssetManager文件。