在另一個綁定之前插入jQuery綁定

Question

在jQuery中，我試圖添加一個「提交」綁定到已經有一個「提交」綁定的表單，但我需要新的（第二個）綁定（回調）在預先存在的之前。

有沒有辦法讓我插入一個綁定，以便它在已經連接的綁定之前觸發？

Answer 1

你可以使用$._data($("#myform")[0], "events").submit

參見click事件的樣品的jsfiddle：

http://jsfiddle.net/X9hat/

Answer 2

觸發器中的第一個回調綁定到新的（二）結合：How to order events bound with jQuery

Answer 3

使用無法訪問綁定函數，假設您的表單的ID爲a，那麼您可以顛倒處理程序調用的順序，如下所示：

[].reverse.call($._data($('#a').get(0)).events.submit); 

Demonstration（點擊 「與JS運行」，打開控制檯，然後點擊 「點擊」 按鈕）

注意，這種結構是undocumented and without guarantee：

請注意，這不是一個支持的公共接口;實際數據 結構可能從版本到版本不兼容。

所以真正的解決方案是更改第一個綁定代碼。

Answer 4

我知道這有點晚了，但jQuery exposed this in v1.7 and higher。我有一個會議，當我回來的時候，會變成一個工作的例子...如果我回來了....祝我好運。

#fiddle 這個逃跑的單擊事件，但你可以切換它與思想

HTML

從的jsfiddle

<form> 
    <p>before click</p> 
    <button type="button">start</button> 
</form> 

的JavaScript

重新發布的HTML重新發布的提交javascript from jsfiddle

var $elem = $("button"), //jqElementObject 
    elem=$elem[0], //html element object 
    eventNameKey="click", //name of the event we want to alter 
    eventHandlerKey="handler"; //jQuery private object reference to get the actual function ref 

$elem.click(function(ev){ 
    //this happens somewhere else, pretend we can't control it per your comments 
    console.log("1"); 
    ev.preventDefault(); 
    $("p").text($("p").text()+"<div>first binding</div>"); 
}); 
//this is ours, we can control this 
function submitControler(ev){ 
     console.log("2"); 
    ev.preventDefault(); 
    $("p").text($("p").text()+"<div>second binding</div>"); 
    //uncomment below to stop propogation 
    //return false; 
} 
$elem.click(submitControler); //actually register our event 
$elem.click(function(ev){ //third event for some fun 
ev.preventDefault(); 
    $("p").text($("p").text()+"<div>third binding</div>"); 
}); 

var officialEvents = $._data(elem,"events"), //jQuery official Private events 
    ourSubmitEvents = $.Callbacks("unique stopOnFalse"); //default Callbacks values promises to behave like a standard events list, however, you want your event to fire first, then others to proceed if it returns true. also, no duplicates just because. 

//I'm running out of time, so i went with a for loop. I wanted a way to find our event where the registration order was not guaranteed, feel free to go for something better 
for(var event = officialEvents[eventNameKey].length-1; event >-1; event--){ 
    if(officialEvents[eventNameKey][event][eventHandlerKey] ===submitControler){ 
     ourSubmitEvents.add(officialEvents[eventNameKey][event][eventHandlerKey]); 
     console.log("added primary controler"); 
     break; 
    } 
} 
//add in everyone else to our list, again, i'm out of time and a for loop was the first thought i had. feel free to improve 
for(var event = 0; event < officialEvents[eventNameKey].length; event++){ 
    if(officialEvents[eventNameKey][event][eventHandlerKey] !==submitControler){ 
     ourSubmitEvents.add(officialEvents[eventNameKey][event][eventHandlerKey]); 
     console.log("added secondary controler"); 
    } 
} 
//this is our event scheduler, it will be first to execute, and calls our manually re-ordered 'ourSubmitEvents' object. ('ourSubmitEvents' becomes 'ev.data') 
$elem.on({"click":function(ev){ 
    ev.preventDefault(); 
    ev.data.fire(ev); 
}},null,ourSubmitEvents); 
//remove the other events, except the one we just registered. 
$._data(elem,"events")[eventNameKey].splice(0,officialEvents[eventNameKey].length-1);