Drupal 9 - 未捕获的 ReferenceError：未定义 jQuery答案

【问题标题】：Drupal 9 - Uncaught ReferenceError: jQuery is not definedDrupal 9 - 未捕获的 ReferenceError：未定义 jQuery
【发布时间】：2020-09-28 04:52:18
【问题描述】：

我正在尝试在 Drupal 9 中使用外部 Javascript 库 areYouSure。我收到错误“Uncaught ReferenceError: jQuery is not defined”。

我的表单 php 代码如下所示。

<?php

function raco_inventory_purchase_form($eid)
{
    $out = 
    '
    <script src="/core/assets/vendor/jquery/jquery.min.js"></script>
    <script src="/libraries/areyousure/jquery.are-you-sure.js"></script>
    <script src="/modules/custom/racoinventory/js/racoinventory.js"></script>
    
    <body>
        <form id="myform" autocomplete="off" action="/racoinventory/purchase/entries/' . $eid . '" method="post">
            <input type="text" id="yourname" name="yourname" value="' . '" placeholder="Enter your name">
            <br><br>
            <input type="button" value="Save" onclick="racoinventory_save_data(this);" />
        </form>

        <script>
          jQuery(function() 
          {
            jQuery("#myform").areYouSure(
              {
                message: "It looks like you have been editing something. "
                       + "If you leave before saving, your changes will be lost."
              }
            );
          });
       </script>
     </body>
    ';
    
    return $out;
}
?>

我的库文件如下所示

# Custom module library for general purposes.
racoinventory:
  css:
    component:
      css/racoinventory.css: {}
  
  js:
    /libraries/raco/racocommon.js: {}
    js/racoinventory.js: {}
    /libraries/areyousure/jquery.are-you-sure.js
    
  dependencies:
    - core/jquery
    - core/jquery.once

javascript 代码如下所示

function racoinventory_save_data()
{
    alert("You hit Save button");
    jQuery('#myform').trigger('rescan.areYouSure');
    return true;
}

使用此代码，当我加载页面时，出现以下错误。

未捕获的类型错误：jQuery(...).areYouSure 不是函数

我不确定这里出了什么问题。有人可以帮我解决这个问题吗？

【问题讨论】：

标签： javascript jquery drupal drupal-9

【解决方案1】：

IMO 你可以尝试将你的代码包装在

(function ($,jQuery) {
  $(document).ready(function(){
   Code here

  });
})(jQuery);

不过，您可以查看 jQuery 库版本，并可以在底部加载 jQuery。

【讨论】：