檢測提交（如果它是由回車鍵或點擊按鈕）的類型

我有以下代碼：檢測提交（如果它是由回車鍵或點擊按鈕）的類型

<head> 
    <script language="javascript"> 
     function subimiti(event){ 
      alert("Tipo do submit: "+event); 
     } 
    </script> 
</head> 
<body> 
    <form id="f1" name="form1" onsubmit="subimiti(event)" action="http://www.google.com"> 
     <input type="text" id="meuId" value="Teste"/> 
     <input id="butao" type="submit" value="Subimeta u fórmi trem bão!!"/> 
    </form>

在我的javascript funcition，我希望我能檢測到引起表單提交的情況下，如果它是通過在我的文本字段中輸入點擊，或者如果是通過點擊按鈕。

來源

2013-06-26 Mateus Viccari

可能重複（http://stackoverflow.com/questions/541869 /確定哪個元素提交了一個從內部提交的表單） – lifetimes

由於keypress事件在有提交按鈕時觸發click事件，所以我能想到的唯一解決方法是使用type =按鈕。

純JavaScript（Fiddle）：

<form id="f1" name="form1" action="" onsubmit="subimiti(this)" method="POST"> 
    <input type="text" id="meuId" value="Test" onkeypress="setEvent(event)"/> 
    <input id="butao" type="button" onclick="setEvent(event)" value="Subimeta u formi trem bao!!"/> 
</form> 

function subimiti(form) 
{ 
    event.preventDefault(); 
    alert(form.getAttribute('event')); 

} 

function setEvent(event) 
{ 
if(event.type == 'click') 
{ 
    document.form1.setAttribute('event','click'); 
    subimiti(document.form1); 
} 
else if (event.keyCode == 13) 
{ 
    document.form1.setAttribute('event','keypress'); 
} 
}

（在我看來更清潔/更簡單的代碼）使用jQuery：

$(function(){ 
    $('form').submit(function(){ 
    alert($(this).attr('event')); 
    }); 

    $("input#butao").on('click', function(e) { 
    $("form").attr("event", "click").submit(); 
    });  

    $("input").on('keypress', function(e) { 
    if (e.which == 13) 
    { 
     $("form").attr("event", "keypress"); 
    } 
    });    
});

有一個點擊監聽器只butao和任何輸入輸入監聽。

<form id="f1" name="form1" action=""> 
    <input type="text" id="meuId" value="Teste"/> 
    <input id="butao" type="button" value="Subimeta u formi trem bao!!"/> 
</form>

Fiddle（添加的preventDefault擺弄，所以你可以看到結果，而無需實際提交）的[確定哪些元素提交一個表單從內部的onsubmit]

來源

2013-06-26 22:14:28 Fabi

+1：'input [type = submit]'將始終觸發兩個事件（'click'和'enter'）。漂亮的解決方法，但是你忘了補充說，這使用jQuery（OP沒有在他的問題中的jQuery標籤） – JFK

多數民衆贊成真，虐待更新答案感謝:) – Fabi

檢測提交（如果它是由回車鍵或點擊按鈕）的類型

回答

相關問題