我有一个搜索表单，我试图让它在页面底部输出结果而不重新加载。
Type First Name 我希望在单击按钮时使用Ajax调用另一个脚本，在下面显示搜索结果。 我一直收到错误：“未捕获的ReferenceError：未在HTMLButtonElement.onclick上定义searchoutput 这是我的javascript（使用jquery）： $( document ).ready(function() { function searchoutput() { if($(".search-field").val().length > 5) { //only shows results when more than 5 characters have been entered var search = $(".search-field").val(); var update = $(".result"); var goal = 0; $.get("query-include.php" , {search: search, goal: goal}) .done(function( data ) { update.empty(); update.append(data); $(this).remove(); }); }; } $( ".search-field" ).keydown(function() { var update =$(".results"); update.empty(); }); }); 我检查了其他post，花了很长时间试图自己解决问题。 奇怪的是，如果我为“keyup”添加一个事件监听器，以便运行与用户类型相同的函数searchoutput： var searchfield = document.getElementById("search"); searchfield.addEventListener("keyup", searchoutput); 然后我没有得到ReferenceError并且脚本运行正常..我只在按钮点击时得到function问题。 这是一个范围问题 – searchOutput是在$(document).ready()函数的范围内定义的。 您可以尝试在该代码之前为searchOutput声明一个var，然后将其分配给函数，如下所示： var searchOutput; $( document ).ready(function() { searchOutput = function () { if($(".search-field").val().length > 5) { //etc. 我在searchoutput（）的位置添加了一个eventListener; $( document ).ready(function() { $('.submit').addEventListener('click', function(){ if($(".search-field").val().length > 5) { //only shows results when more than 5 characters have been entered var search = $(".search-field").val(); var update = $(".result"); var goal = 0; $.get("query-include.php" , {search: search, goal: goal}) .done(function( data ) { update.empty(); update.append(data); $(this).remove(); }); } }); $( ".search-field" ).keydown(function() { var update =$(".results"); update.empty(); }); }); Jquery Accordion – 使用锚点从外部和内部链接打开特定面板 然后jQuery AddClass删除一个类 jquery日期转换chrome工作但IE和Firefox没有为什么我的JavaScript函数没有填充我的数组？从JavaScript中的字节下载文件从输入缩放图像在媒体窗口中选择图片后添加/更新自定义字段（WordPress）jQuery .search（）到任何字符串使用appendTo进行div更改父项在FullCalendar中更改日背景颜色为什么我不能通过ID（无iframes）访问这个动态加载的DOM元素？ Go! Interesting Posts 将JSON传递给JQuery函数Javascript从MS Outlook实现拖放function到我们的Web应用程序绑定父元素与元素直接相比有优缺点吗？使用ChartEditor调整Google可视化的大小链接下拉菜单，其中包含引导程序中的选项卡JQuery – 在’for’语句中循环.load（）使用jQuery / ajax进行基本身份validationjQuery ajax返回数据：json和html混合？jquery：进度条在html中显示$ http.post在AngularJS中不起作用
Type First Name
我希望在单击按钮时使用Ajax调用另一个脚本，在下面显示搜索结果。 我一直收到错误：“未捕获的ReferenceError：未在HTMLButtonElement.onclick上定义searchoutput
这是我的javascript（使用jquery）：
$( document ).ready(function() { function searchoutput() { if($(".search-field").val().length > 5) { //only shows results when more than 5 characters have been entered var search = $(".search-field").val(); var update = $(".result"); var goal = 0; $.get("query-include.php" , {search: search, goal: goal}) .done(function( data ) { update.empty(); update.append(data); $(this).remove(); }); }; } $( ".search-field" ).keydown(function() { var update =$(".results"); update.empty(); }); });
我检查了其他post，花了很长时间试图自己解决问题。 奇怪的是，如果我为“keyup”添加一个事件监听器，以便运行与用户类型相同的函数searchoutput：
var searchfield = document.getElementById("search"); searchfield.addEventListener("keyup", searchoutput);
然后我没有得到ReferenceError并且脚本运行正常..我只在按钮点击时得到function问题。
这是一个范围问题 – searchOutput是在$(document).ready()函数的范围内定义的。 您可以尝试在该代码之前为searchOutput声明一个var，然后将其分配给函数，如下所示：
searchOutput
$(document).ready()
var searchOutput; $( document ).ready(function() { searchOutput = function () { if($(".search-field").val().length > 5) { //etc.
我在searchoutput（）的位置添加了一个eventListener;
$( document ).ready(function() { $('.submit').addEventListener('click', function(){ if($(".search-field").val().length > 5) { //only shows results when more than 5 characters have been entered var search = $(".search-field").val(); var update = $(".result"); var goal = 0; $.get("query-include.php" , {search: search, goal: goal}) .done(function( data ) { update.empty(); update.append(data); $(this).remove(); }); } }); $( ".search-field" ).keydown(function() { var update =$(".results"); update.empty(); }); });