HTML 负载 jQuery function

Question

谁能帮我理解，为什么我无法使用 HTML（index.htm）加载我的 jQuery 函数（存储在 script.js 中）

以下是以下代码：

脚本.js

 $.get("./Components/head.htm", function(data) { $("head").append(data); }); $("#logo").on("error", function() { $(this).hide(); $("#name").show(); }); $("#search").keyup(function() { alert($(this).val()); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <:DOCTYPE html> <html lang="en"> <head> <title>SAM</title> <script src="https.//code.jquery.com/jquery-3.5.1.min.js"></script> <script src="./script.js"></script> </head> <body> <div id="header"> <div id="brand"> <img src="./Static/Logo.png" id="logo"> <h1 hidden id="name">SAM Store</h1> </div> <div> <input type="search" id="search" list="suggest"> <datalist id="suggest"> <option value="Laptop"></option> <option value="Mouse"></option> <option value="Keyboard"></option> <option value="Speaker"></option> <option value="Earphone"></option> </datalist> </div> <script> </script> </div> </body> </html>

[注意：如果我在 index.htm 中添加 $.get function 并使用它导入 script.js，则函数正在工作，但如果我在 index.htm 上引用 script.js 并导入 $.get function，它们将不起作用. 此外，在这两种情况下，浏览器都能够成功加载 script.js]

Answer 1

当您使用 jquery 时，始终将代码加载到就绪语句中，否则它们将不会始终按时加载。

$( document ).ready(function() {

  $.get("Components/head.htm", function(data) {
    $("head").append(data);
  });

  $("#logo").on("error", function() {
    $(this).hide();
    $("#name").show();
  });

  $("#search").keyup(function() {
    alert($(this).val());
  });

});

HTML 负载 jQuery function

问题描述

1 个解决方案

解决方案1
0 已采纳 2021-01-25 07:53:13

HTML 负载 jQuery function

问题描述

1 个解决方案

解决方案1 0 已采纳 2021-01-25 07:53:13

解决方案1
0 已采纳 2021-01-25 07:53:13