javascript资产中的jQuery未启动

jQuery in javascripts assets not firing

本文关键字：jQuery 启动 javascript      更新时间：2023-09-26

如果我把这个代码放在erb视图中，它可以完美地工作

<script type="text/javascript">
  $('.disabled-course').click(function() {
    $('#alert').html(
      '<div class="alert alert-warning alert-dismissible">' +
      '  <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>' +
      '  <h4><i class="icon fa fa-warning"></i>¡Alerta!</h4>' +
      '  Los cursos en vivo solo están disponibles para usuarios premium' +
      '</div>'
    );
  })
</script>

但是，当我将相同的代码（除了脚本标记）放在assets/javascripts文件夹中它自己的文件中时，它就停止工作了。我也无法正确显示unicode字符（我得到的是"而不是"）

rails生成的js文件如下所示：

$('.disabled-course').click(function() {
  $('#alert').html(
    '<div class="alert alert-warning alert-dismissible">' +
    '  <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button>' +
    '  <h4><i class="icon fa fa-warning"></i>¡Alerta!</h4>' +
    '  Los cursos en vivo solo están disponibles para usuarios premium' +
    '</div>'
  );
})

我已经检查了jQuery是否包含在其他内容之前，还尝试将其放入$(document).ready(function() {} 中

确保在application.js清单中包含javascript文件：

application.js

//= require jquery
.. A bunch of other requires
//= require name_of_js_file

这将加载一个名为app/assets/javascripts/name_of_js_file.js的文件。作为健全性检查，请通过检查开发工具控制台来确保name_of_js_file.js已加载。您还可以添加一个console.log，以便在加载脚本时激发，作为健全性检查。

此外，为了安全起见，我总是将这类代码封装在$(document).ready(function() {}回调中，就像您提到的那样。这样做的原因是，即使加载了jQuery，页面上也可能还不存在$('.disabled-course')元素。

相关文章：