獲取提交按鈕的ID與onsubmit事件

Question

HTML：

<form action="javascript:void(0)" method="post" onsubmit="form_process()"> 


<input type="submit" id="btn_id" value="Submit" /> 
</form> 

JavaScript代碼段：

function form_process(){ 


    $elem = $(this); 

    if(window.console){ 

    console.log(" button id = " + $elem.attr('id')); 


    } 



}// end if function form_process() 

但是控制檯顯示id爲undefined。問題是在jQuery中選擇提交按鈕。我怎樣才能得到提交按鈕的id？

Answer 1

在你的代碼this是指全局窗口對象。這是類似$(window)

選項1：

通this表單中的

<form action="javascript:void(0)" method="post" 
     id="my-form" onsubmit="form_process(this)"> 

function form_process(obj){  

    $elem = $(obj).find(input[type="submit"]); 
    if(window.console){ 
     console.log(" button id = " + $elem.attr('id')); 
    } 

} 

選項2：不引人注目的JS

$('#my-form').submit(function(){ 
    $elem = $(this); 
}); 

Answer 2

您可以使用下面的結構;

HTML：

<form action="javascript:void(0)" method="post"> 
    <input type="submit" id="btn_id" value="Submit" /> 
</form> 

JS：

// or you can use class for this form 
$('form').on('submit', function() { 
    $elem = $(this); 
    var id = $elem.children('input[type="submit"]').attr('id'); 
    if(window.console){ 
     console.log(" button id = " + id); 
    } 

}); 

這裏是工作提琴：http://jsfiddle.net/cubuzoa/qWvz9/1/