活綁定提交不指向鉻中的元素

Question

運行下面的代碼，我期望看到相關的表單，所以我可以從中提取信息。相反，this指向文檔。

我認爲它與使用活動綁定有關，是否有解決方法？

$('.form_one').add('.form_two').live('submit',function(e){ 
     e.preventDefault(); 
     console.log($(this)); 
    }) 

Answer 1

這是因爲live()是委派的事件處理程序的最高水平DOM元素的快捷方式 - document - 這就是爲什麼this點範圍存在。

作爲解決方法，您應該使用$(e.target)來獲取引發事件的元素。

另外，live()已被棄用，如果您使用jQuery 1.7+，您應該使用delegate()或on()。

Example fiddle

Answer 2

http://jsfiddle.net/ZBaWd/將演示如何使用on處理程序。

<div id="container"></div>​ 

var cont = $("#container"); 

// Note that I'm attaching it to container and not the forms themselves. 
// Then, as an additional parameter, I provide the selector "form" so that 
// `on` is only fired for "form" elements that "submit" and are children of "#container" 
$("#container").on("submit", "form", function(e){ 
    e.preventDefault(); 
    console.log($(this)); 
}); 


$("<form>").addClass("form_one").append("<button type='submit'>Submit 1</button>").appendTo(cont); 
$("<form>").addClass("form_two").append("<button type='submit'>Submit 2</button>").appendTo(cont);