阻止仅输入提交按钮，而不是表单的其余部分

Question

好的，所以我一直在搜索一段执行此操作的代码，并且没有任何内容适用于我的情况。

我的问题：我试图阻止表单在＆＃34; ENTER＆＃34;按下了键，但在按下回车键时允许表单内的搜索脚本提交。

我发现的是阻止Enter键时段的脚本，或者脚本不起作用，因为我认为我使用的是<button>而不是{{1} }作为我的提交按钮，我不太确定。

我的表格

<input>

我的javascript，我的搜索

<form action="" method="post" onsubmit="return false;" id="myform">

我的搜索输入

    function showSub(str) {
    var xmlhttp;
    if (str=="") {
      document.getElementById("txtSub").innerHTML="";
      return;
    }
    if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
    }
    else {// code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function() {
      if (xmlhttp.readyState==4 && xmlhttp.status==200) {
        document.getElementById("txtSub").innerHTML=xmlhttp.responseText;
      }
    }
    xmlhttp.open("GET","findLogo.php?q="+encodeURIComponent(str),true);
    xmlhttp.send();
}  
$(document).on('change', '#searchText', function() {
// Get the search text
var searchText = $(this).val();
// Make sure it isn't empty
    if (searchText.length > 0) {
        // Send the update request
        showSub(searchText);
    }
});

我的提交按钮

<input type="text" id="searchText" value="" />
<div id="txtSub"></div>

我的java脚本帖子提交脚本

<input type="hidden" value="Post" name="submit" /> 
<button type="submit" style="height:33px; width:50px">
<img src="../css/images/plus_25.png" />
</button>

Answer 1

解决方案基本上是基于检测按键和阻止表单提交

1. 首先制作两个按钮，用于搜索和表单提交为<input type="button" />
2. 要区分搜索按钮和提交按钮，请在此处使用您的合适名称为其添加课程，我添加了.submit和.Search
3. 另一件事，在.submit button上使用链接，如果按下键是输入密钥，它用于防止点击事件阻止执行
4. 如果通过选择该按钮表单点击任何其他按钮，则使用回车键阻止提交导致另一个问题将进入以防止还添加其他情况，这会阻止基于按钮的表单提交提交按钮，另一个加点是您可以添加任何自定义按钮以进行提交
5. 接下来，Click块提交通过步骤4到达的表格，如果按键是开始执行流程的原因则停止步骤

---

两个示例添加一个带提交按钮，基于点击另一个进行搜索，基于点击/输入

另一个优点是它不会阻止您使用输入搜索按钮

Solved Click for demo To know the difference submit with enter key and search with enter key

HTML

<input type="button" class="Submit" value="Submit"/>

<input type="button" class="Search"  value="Search"/>

Jquery的

$("input.Submit").keypress(function(event){

    if(event.which=='13'){

        alert("Key enter key entered ");
     event.preventDefault();



 }else{
      event.preventDefault();
    }


}).click(function(event){
    alert("Here is the submit Button works on click write jquery ");

  $( "#FormId" ).submit();
});


//The Code For Search Which could be triggered by both keypress and click


  $("input.Search").click(function(event){

              alert("Works for both enter and click");
            });

修改

Demo With Search just like google on entering text to search on text box and clicking enter triggers the search

在搜索框中输入一些文字按回车键

Jquery的

$("input.Search").keypress(function(event){

          if(event.which=='13'){

            alert("Key enter key entered ");

        }
    });