javascript - 使用 jquery 的 AJAX 的外部 scripts.js 在 HTMLInputElement.onkeyup 处返回 Uncaught ReferenceError-6ren

javascript - 使用 jquery 的 AJAX 的外部 scripts.js 在 HTMLInputElement.onkeyup 处返回 Uncaught ReferenceError

转载作者：行者123 更新时间：2023-11-30 20:37:36

24

4

我花了大半天的时间来寻找这个问题的答案，我就是不能全神贯注。我有一个需要 head 元素的 Index.php。头部元素:

<!DOCTYPE html>
 <html>

 <head>
   <meta charset="utf-8">
   <link rel="stylesheet" href="requires/style.css" type="text/css">
   <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
   <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
   <script src="requires/scripts.js"></script>
   <title>Frontends</title>
</head>

<body>
   <div class="grid-container">

        <div class='header' style="background-color: #0059B3;">
            <a href='index.php'>
                <img src="assets/hhe logo.PNG"/>
            </a>
        </div>

这是 index.php 文件所必需的，该文件如下所示:

<?php
require_once 'requires/head.html';
require 'requires/connect.php';
$string = "";
?>
    <script type="text/javascript">

    </script>
    <div class='content' style='border-radius: 4px;'>

        <div class="formcentre">
            <input class="searchform" type="text" id="search" placeholder="Søger så snart du skriver." onkeyup="submitter();" autocomplete="off"/>
        </div>

        <div class='menu' style=' margin-top:10px;'>
            <dl>
                <dt>Tilføj</dt>
                <dd>
                    <a href='opret.php'>Artikel</a><br>
                    <a href="addnew.php">Enhed</a><br>
                    <a href="newscim.php">Kategori</a><br>
                </dd>
                <dt>Slet</dt>
                <dd>
                    <a href="slet.php">Enhed</a><br>
                    <a href="sletkategori.php">Kategori</a>
                </dd>
            </dl>
        </div>

        <table id="results">

        </table>

        <a href="#" class="scrollToTop">⌃</a>

    </div>

</div>
<script type="text/javascript" src="requires/scripts.js"></script>
</body><!--Is opened in the reuired head.html-->
</html><!--Is opened in the reuired head.html-->

当然有一个看起来像这样的 scripts.js 文件:

function goBack() {
            window.history.back();
        }

function submitter() {
    var search = document.getElementById("search").value;
    /*AJAX the searchstring*/
    $.ajax({
        type: 'post',
        url: 'ajax/searcher.php',
        data: { searchString : search },
        success: function(response){
            $('#results').html(response);
        }
    });
    return false;
} 
$(document).ready(
function submitter() {
    var search = document.getElementById("search").value;
    /*AJAX the searchstring*/
    $.ajax({
        type: 'post',
        url: 'ajax/searcher.php',
        data: { searchString : search },
        success: function(response){
            $('#results').html(response);
        }
    });
    return false;
}

function(){

//Check to see if the window is top if not then display button
$(window).scroll(function(){
    if ($(this).scrollTop() > 20) {
        $('.scrollToTop').fadeIn();
    } else {
        $('.scrollToTop').fadeOut();
    }
});

//Click event to scroll to top
$('.scrollToTop').click(function(){
    $('html, body').animate({scrollTop : 0},800);
    return false;
 });

});

这一切都很好，我遇到了这个问题，当我尝试搜索任何东西时都会遇到这个特定的错误:

未捕获的 ReferenceError:未在 HTMLInputElement.onkeyup (index.php:27) 中定义提交者

所以问题是:我不应该这样做吗？

编辑:我想补充一点，显然浏览器可能会缓存一个 JS 文件。所以，是的，清除缓存。这就是真正的技巧，包括标记解决方案中的第四点。非常感谢您的帮助。

最佳答案

拜托，让我们做两件事:

不要混合使用 JavaScript 和 jQuery(尽管两者都是 JavaScript)。
使用不引人注目的代码。

这些是我所做的更改:

从元素中删除 onkeyup:

<input class="searchform" type="text" id="search" placeholder="Søger så snart du skriver." autocomplete="off"/>

使用 document 的 ready 事件添加事件监听器:

$(function () {
  $("#search").keyup(function () {
    submitter();
  });
});

更好的是，你可以这样做:

$(function () {
  $("#search").keyup(submitter);
});

感谢Chris G .

使用单一方式:

function submitter() {
  $.ajax({
    type: 'post',
    url: 'ajax/searcher.php',
    data: {
      searchString: $("#search").val()
    },
    success: function(response) {
      $('#results').html(response);
    }
  });
  return false;
}

删除 submitter() 函数定义的重复出现。在 document 的 ready 事件中只有一个。

关于javascript - 使用 jquery 的 AJAX 的外部 scripts.js 在 HTMLInputElement.onkeyup 处返回 Uncaught ReferenceError，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/49650644/

24

4

0

文章推荐： javascript - react 状态没有 Jest 更新

文章推荐： c - 二进制文件 fread/fwrite 和 calloc/free 内存泄漏？

文章推荐： c - 如何在不知道范围的情况下获取多个数字用户输入

java - 如果我将一个对象放入数组中的索引 0 处，如何将那里的对象放入索引 1 处？
这个问题已经有答案了: What is the difference between a variable, object, and reference? [duplicate] (5 个回答) 已关
Java套接字程序卡在sc.nextInt()处；
我正在使用以下代码来学习java套接字编程。它的作用是，client.java 程序从用户那里获取一个号码并将其发送到 sever.java。然后服务器将其乘以2并发回给客户端。在我的客户端程序中，它
delphi - 非重叠串行端口卡在 CloseHandle 处
我编写了一个自己开发的串行端口类，为了简单起见，我使用了阻塞/同步/非重叠。我浏览了所有 MSDN 文档，这对我来说很困难。我在从端口打开、传输或接收字节方面没有任何问题。所有操作都是同步并且没有线
javascript - 为什么我的倒计时没有停在 0 处？
//Not finished -- disregard function evaluate() { var cdate = new Date(); var cday = cdate.getDa
python - 我希望程序停止在十进制 "."处；如何让Python抓取字母直到字符串中的某个字符？
我已经尝试过了，但它有效例如: x= 523.897 y= x[0:"."] print y 我只想打印 523。如何让 Python 抓取字符串直到某个字母或数字？最佳答案行 y = x[0:
javascript - 我怎样才能把盒子移到拐 Angular 处
我想移动拐 Angular 处的方框(从左上角开始水平移动 Angular 落到右上角然后你去到右下角。 function myMove() { var elem = document.getEl
javascript - 如何让侧边栏停在某个 div 处？
如何让侧边栏停止在第二个侧边栏部分而不是顶部？ fiddle http://jsfiddle.net/EvAdP/2/ HTML I'm the header
java - 基本程序卡在 nextInt() 处
我刚刚在大学开始我的第二门编程类(class)，我们的第一个作业相当简单，旨在基本上检查我们的环境并检查我们是否知道如何通过类(class)网站提交作业。当我运行我们提供的代码时，它卡在应该提示用户
html - 邮箱显示在 "random"处
我目前正忙于我的这个信息学元素(构建一个示例交友网站)。问题是我在把所有东西都放在正确的地方时遇到了一些麻烦。一切都很顺利，直到我的邮箱出现在错误的位置(但是，Dreamweaver 会按照我的意
CSS:将目标区域悬停在元素高度的 50% 处
我想，和你一样hover a GIF shot on Dribbble , 当光标位于元素高度顶部之后/50% 处时显示带有信息的 div。测试示例我做了这个，这是有效的，但有点棘手......特
javascript - Dropit 下拉列表不会隐藏在 mouseleave 处
我有一个下拉菜单，并且我已将 mouseenter 设置为选项。因此，如果鼠标位于触发器之外，菜单应该关闭。我正在使用 jQuery 1.8.0。这可能是 CSS 问题吗？这是我初始化插件的代码。
VBA 脚本卡在 Workbook.Close 处
我正在尝试在 Visual Basic for Applications 中编写一个 hello world 应用程序，即修改 Excel 工作表中的单元格。这是: Sub hello() D
multithreading - 线程卡在 UIComponent.popComponentFromEL 处
我的应用程序使用 JSF 2.1 和 PrimeFaces。最近，由于一些线程卡住，观察到 CPU 利用率非常高。所有卡住线程的卡住线程转储都指向 javax.faces.component.UICo
javascript - Node JS 应用程序卡在resolve() 处
在列出 aws cognito 用户时，我的 Node js 应用程序遇到问题。仅当我有超过 60 个 Cognito 用户时才会出现此问题。 Reference of API 下面是我的代码片段。
php - 卡在 os.rename() 处
我是 ubuntu 用户..我在 php 中有一个执行 python 文件的命令..python 文件设置为可执行文件..所以，我的 php 命令是:- shell_exec("try.py");
C 程序卡住在 fprintf 处(大量数据)
我正在尝试将剪贴板内容写入文件，但由于某种原因程序卡住了。 FILE *fp; fp = fopen("tmp.code","w"); fprintf(fp,getclip()); /*writes*
javascript - 当用户向下滚动时，如何使侧边栏停在特定的 div 处？
当用户向下滚动时，我使用此代码使侧边栏固定在某个 div 处。问题是我必须手动输入一个阈值数字，这并不总是理想的，因为该部分的位置可能会更改或在各种浏览器和系统之间不一致。我想知道是否有一种方法可以在
java - 移动字符串数组中的元素，直到所选字母位于索引 0 处
我有一个字符串数组，例如 first_page = {{"U","M","Y","Q","I","A","L","D","P"、"F"、"E"、"G"、"T"、"Z"、"V"、"W"、"H"、"O"、
javascript - 将元素放置在特定的 px 处，但让文本围绕它流动
我能否在页面上的特定 px 位置放置一个元素(例如图像)，然后让文本围绕它流动？必要时使用 JS/jquery。我确实看到了这个Have text flow around an object th
Javascript onclick 位于浏览器选项卡中的 "Connecting..."处
第一次在这里提问。我有两个简单的 Javascript 函数，1. 生成一个随机字母，2. 在每个单元格中使用单个字母填充 10x10 表格。创建表的主要函数是通过带有 onclick 的简单 HT

首页

博学

6Ren·AI

商城

javascript - 使用 jquery 的 AJAX 的外部 scripts.js 在 HTMLInputElement.onkeyup 处返回 Uncaught ReferenceError