有时 select2 在 moodle 插件中不起作用/加载
[英]Sometimes select2 is not working/loaded in moodle plugin
问题描述
I worked with moodle and I created a plugin in it.
我与moodle一起工作，并在其中创建了一个插件。 In this one I used the library select2 .在这个我使用了库select2 。
In my view.php file of the plugin, I have:在我看来插件的php文件中，我有：
foreach((array) $jsFiles as $path) {
$PAGE->requires->js(new moodle_url($CFG->wwwroot . '/mod/exam/subplugins/'.$path));
}
?>
<!DOCTYPE html>
<!-- Essential to activate bootstrap -->
<html>
<head>
<link rel="stylesheet" type="text/css"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script
src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="select2/select2.min.css" rel="stylesheet" />
<script src="select2/select2.full.js"></script>
<link href="select2/chart.min.css" rel="stylesheet" />
<script src="select2/chart.min.js"></script>
<title></title>
</head>
<?php
?>
</html>
<?php
echo $OUTPUT->footer();
So, I load the library here.所以，我在这里加载库。 And I use it in the javascript file:我在 javascript 文件中使用它：
$(document).ready(function() {
var script = $.getScript("../../mod/exam/select2/select2.min.js");
init();
});
The first time, I loaded the script just in the ready function, but now I load it also in the init function and by doing this, it works more often.第一次，我只在准备好的 function 中加载了脚本，但现在我也在 init function 中加载了它，通过这样做，它可以更频繁地工作。 And I also have a button to add a select2 field.而且我还有一个按钮来添加一个 select2 字段。 And I loaded the script with the $.getScript function in the top of this function to make it works more often.我在 function 的顶部使用$.getScript function 加载了脚本，以使其更频繁地工作。 If I don't do that when I click on the button, the most of the time, it doesn't work and I have something like that:如果我在单击按钮时不这样做，大多数情况下，它不起作用，我有类似的东西：
In my local machine on windows 10 it works 9 times on 10 with all browsers (chrome, firefox...)在我在 windows 10 上的本地机器上，它在所有浏览器（chrome、firefox ...）上在 10 上运行 9 次
I tested it on another machine on ubuntu, and it worked really not often with all browsers.我在 ubuntu 上的另一台机器上对其进行了测试，并且它在所有浏览器上都不是经常工作。 And I also tested it on a virtual machine on linux and it's like in localhost.我还在 linux 上的虚拟机上对其进行了测试，就像在 localhost 中一样。 When I access it from my machine on windows 10, it works 9 times on 10 and on the machine on ubuntu, it worked really rarely.当我在 windows 10 上的机器上访问它时，它在 10 上工作了 9 次，在 ubuntu 上的机器上工作，它真的很少工作。
When it doesn't work, I have this error: Uncaught Error: Mismatched anonymous define() module: function(u){var e=function... from require.min.js and after, this one: createexam.js:98 Uncaught TypeError: $(...).select2 is not a function from my javascript file.当它不起作用时，我有这个错误： Uncaught Error: Mismatched anonymous define() module: function(u){var e=function...来自require.min.js和之后，这个： createexam.js:98 Uncaught TypeError: $(...).select2 is not a function from my javascript file.
I also tried to load the library in other way provided by moodle like $this->page->requires->js(...) or without $.getScript function.我还尝试以 moodle 提供的其他方式加载库，例如$this->page->requires->js(...)或不使用$.getScript function。 But each time, it works less often than now.但每次，它的工作频率都比现在低。
So, do you have an idea why it doesn't work each time on all machines?那么，您知道为什么它每次都不能在所有机器上工作吗？ Or do I load the library not in the good way?或者我加载库的方式不是很好？
2 个解决方案
解决方案1
1 已采纳 2019-11-06 06:50:12
I never worked with Moodle but I worked with RequireJS.我从未使用过 Moodle，但我使用过 RequireJS。 Your site uses RequireJS and select2 does support RequireJS .您的站点使用RequireJS并且select2确实支持RequireJS 。 So you have to load it via RequireJS .所以你必须通过RequireJS加载它。 Otherwise it will not work when RequireJS loads as first - so from time to time:)否则，当RequireJS第一次加载时它将不起作用 - 所以有时:)
Use RequireJS:使用 RequireJS：
require(['select2/select2.full.js', 'select2/chart.min.js'], function () {
$(document).ready(function() {
var script = $.getScript("../../mod/exam/select2/select2.min.js", function () {
init()
});
});
});
解决方案2
0 2022-05-25 18:49:11
Apparently moodle js caching is the reason.显然moodle js缓存是原因。 Administration->appearence->ajax and javascript->turn off caching. Administration->appearence->ajax and javascript->关闭缓存。
UPD: so my select2 was working during page initial rendering, but once document was ready select2 never registered again with that 'select2 is not a function' message. UPD：所以我的 select2 在页面初始呈现期间工作，但是一旦文档准备好 select2 就再也没有注册过“select2 不是函数”消息。 I checked several times if jquery loads twice, the order of my scripts etc.我检查了几次 jquery 是否加载两次，我的脚本的顺序等。
$.noConflict(true)
Helped me finally.终于帮到我了。 I put it before select2 calls, jquery resovles its inner issues and the error is gone.我把它放在 select2 调用之前，jquery 解决了它的内部问题并且错误消失了。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.