提交搜索字词，而不是实时搜索（密钥功能） [英] Submitting search terms instead of live searching (keyup function)

问题描述

我是卡尔，我还是新来的这个地方和一个菜鸟，当谈到编码。请多多包涵。我更多的是HTML和CSS。
我最近找到了此Live Search教程基于AJAX，JQuery和JSON，其中搜索功能从输入字段开始输入时立即作出反应。 keyup（）命令似乎与此有关。

I'm Karl and I'm still new to this place and a rookie when it comes to coding. Please bear with me. I'm more into HTML and CSS. I recently found this Live Search tutorial based on AJAX, JQuery and JSON, where the search function reacts instantly from the moment you start typing in the input field. The keyup() command seems to have something to do with this.

$('#search').keyup(function(){
 var searchField = $('#search').val();
 var myExp = new RegExp(searchField, 'i');
 $.getJSON('data.json', function(data){
  var output = '<ul class="searchresult">';
  $.each(data, function(key, val){
   if((val.name.search(myExp) != -1) || (val.bio.search(myExp) != -1)) {
(...)

我目前正在本地服务器上测试此实时搜索（工作方式类似于charm。）

I'm currently testing this live search on a local server. (Works like a charm.)

我想知道是否可以发送用户定义的查询/搜索项通过提交他们通过回车键（传统的方式）和/或通过搜索/提交按钮。我尝试使用submit替换 keyup 功能，例如此视频例如，我试图应用这种提交，这是在上述视频中提到，但我没有得到它的工作相应。我甚至通过谷歌，YouTube上的许多不同的视频，DailyMotion等搜索各种教程，甚至比较stackoverflow和其他类似的网站上的许多问题。我很可能错过了树的森林。

I was wondering if it was possible to send user defined queries / search terms by submitting them via the enter key (the conventional way) and/or via a search/submit button instead. I tried replacing the keyup function with submit. Something like on this video for instance. I tried to apply this kind of submitting, which was mentioned in the aforementioned video, but I didn't get it to work accordingly. I even searched various tutorials via Google, many different videos on Youtube, DailyMotion, etc. and even compared many questions here on stackoverflow and other similar sites. I'm most likely missing the forest for the trees.

任何帮助将非常感谢。提前感谢。

Any help would be greatly appreciated. Thank you in advance.

推荐答案

您可以将搜索框放在表单中，因此当用户点击回车按钮时提交...并停止正常的提交方法并使用Ajax发送查询参数。

You can put the search box inside a form, so when the user hits the enter button it will submit... and you stop the normal submit method and send the query parameters with Ajax.

function ajaxSubmit(event){
  event.preventDefault();
  
  alert('submit stopped');
  
  //ajax code here
  

};

<form action="" method="post" onSubmit="ajaxSubmit(event)">
  
  <label for="search">Search box:</label><br>
  <input type="search" placeholder="Write here and press enter" id="search">
  
</form>

这篇关于提交搜索字词，而不是实时搜索（密钥功能）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！