將事件綁定到所有主幹視圖中的所有文本輸入字段

我正在尋找一種方法來創建跨越應用程序內所有視圖的全局綁定，這樣我就不必在每個視圖中單獨設置這些全局視圖。將事件綁定到所有主幹視圖中的所有文本輸入字段

如果建議的機制具有單個輸入字段或視圖退出此行爲的方式，則爲獎勵分。

詳情：

我遇到這個錯誤的虛擬鍵盤會導致positioned: fixed;（頭），以在屏幕上奇怪地定位一個div，然後正確地重新定位，再次當鍵盤隱藏;我選擇來解決這個使用類似這樣的解決方案：

https://stackoverflow.com/a/15537846/194982

現在，有可能這個單獨適用於所有的文字輸入元素，像這樣：

events: { 
    'blur input#myInputText': '_myInputTextBlur', 
    'focus input#myInputText': '_myInputTextFocus' 
}, 
_myInputTextBlur: function() { console.error('_myInputTextBlur'); 
    $('.page-header').css('display', 'block') 
}, 
_myInputTextFocus: function() { console.error('_myInputTextFocus'); 
    $('.page-header').css('display', 'none') 
},

來源

2013-11-21 bguiz

您好我寫了我tipp在咖啡腳本，因爲它更簡單。

您可以使用類似於ruby mixins的機制。然後用你的共同行爲創建一個混合。然後將關注點混合到擴展Backbone.View的類中。然後在所有地方使用基礎視圖類作爲視圖類的基礎。

這是mixesIn underscore功能：

_.mixin 
    mixesIn: (base, mixins...) -> 
    class Mixed extends base 
    for mixin in mixins by -1 
     for name, method of mixin:: 
     Mixed::[name] = method 
    Mixed

這是您的關心：

class InputSupport 
    events: 
    "blur input#myInputText": "_myInputTextBlur" 
    "focus input#myInputText": "_myInputTextFocus" 

    _myInputTextBlur = -> 
    console.error "_myInputTextBlur" 
    $(".page-header").css "display", "block" 

    _myInputTextFocus = -> 
    console.error "_myInputTextFocus" 
    $(".page-header").css "display", "none"

這將是你的基本視點類：

class BaseView extends _(Backbone.View).mixesIn InputSupport

在你們每個人專門

然後您可以從BaseView類擴展視圖類。

class HeaderView extends BaseView 
... 
class SidebarView extends BaseView 
... 
class FooterView extends BaseView 
    events: 
    "blur input#myInputText": "_myInputTextBlur" 
    "focus input#myInputText": "_myInputTextFocus" 
    "click .someotheButton": 'handleSomeOtherButton'

在您需要重複的關注聲明的事件，除非你寫一個合併兩個散列更智能mixesIn功能最後一種情況下...這可以用_.defaults功能很容易做到，但在這種情況下，你會面對你的後代類中的事件減去問題，這將是一種氣味。

來源

2013-11-21 17:30:35 Boti

將事件綁定到所有主幹視圖中的所有文本輸入字段

回答

相關問題