PolymerJS：多個事件火了同樣的動作（上模糊當上提交）

我有這個輸入表格，我要保存輸入的值，每當用戶要麼觸發一個on-submit或的on-blur事件。PolymerJS：多個事件火了同樣的動作（上模糊當上提交）

而我有這個問題，無論何時用戶觸發on-submit，自然也會觸發on-blur事件。因此兩個具有相同內容的事件被激發。（不是一個大問題，但仍然）。

我已經搜索瞭解決方案，並找到了很多jQuery，我相信我需要一個原始javascript解決方案。

這裏是我的形式：

<form method="post" on-submit="doneEditAction"> 
    <input 
     type="text" 
     value="{{editValue::input}}" 
     id="editItemInputField" 
     on-keyup="editKeyupAction" 
     on-blur="editBlur"> 
    <button type="submit">edit</button> 
</form>

這種形式的觸發事件doneEditAction當我提交表單。但與此同時，editBlur事件也被觸發，應該與doneEditAction事件相同，以保存輸入的值。

editBlur事件

editBlur: function (e) { 
    this.doneEditAction(e); 

    this.editing = false; 
}

doneEditAction事件

doneEditAction: function (e) { 
    e.preventDefault(); 

    console.log(this.editingValue); 

    this.editing = false; 
}

這裏是我的問題：

表單提交時，如何讓表單不觸發on-blur事件？或者
如何讓表單始終只發生一個事件？或者，請參閱編輯，
如果兩個相同的事件被觸發，它是否甚至都有問題（從性能角度來看）？

編輯

剛纔看到的Polymer TodoMVC，他們也火事件，當您嘗試對其進行編輯。證明：

這是否意味着，它實際上並不重要，如果兩個相同的事件被解僱？

來源

2015-11-22 LoveAndHappiness

由於每次觸發on-submit事件時on-blur事件都會自動觸發，因此會執行兩次事件處理程序doneEdit。

而且由於doneEdit事件處理程序設置editing屬性false兩次，有一個簡單的解決方案，以確保只執行一次doneEdit事件。

在doneEdit我們檢查editing是true，然後才進行任何我們想要的動作，editing值設置爲false。

doneEdit(function) { 
    if(this.editing === true) { 
     this.editing = false; 
     console.log(this.editingValue); 
    } 
}

因此，當doneEdit處理程序將被稱爲第二時間由於on-blur事件，this.editing已經設置爲false，不執行兩次console.log()。

感謝PolymerTodoMVC源代碼。

來源

2015-11-23 06:35:52 LoveAndHappiness

PolymerJS：多個事件火了同樣的動作（上模糊當上提交）

回答

相關問題