使用backbone.js時導致鍵盤選項卡導航斷開

TAB導航中斷，因爲render會替換DOM元素。使用backbone.js時導致鍵盤選項卡導航斷開

骨幹渲染方法的設計與整個視圖的標記，並不僅改變了的東西的工作...

鑑於以下 - 我正確地設置tabIndex上的HTML標記指定Tab鍵順序。 - 我通過在鍵盤上使用TAB從一個字段到另一個字段進行導航。 - 當模型狀態改變時，我將綁定到調用渲染的change change事件，如下所示： - this.model.bind（'change'，this.render）; - 我改變一個字段和標籤的東西到下一個（這將觸發模式改變事件）

有沒有人沒有明確的代碼檢查所有更改的屬性解決這一點，無需更換主幹（因爲這不是一個選項在當前項目）

實施例：

啓動的TODO 應用創建2個待辦事項，標籤到第一TODO並按空間標記是爲完成。然後嘗試標籤到下一個字段，而不是去到下一個TODO你又回到了需要做輸入:(

來源

2013-05-15 James Kyburz

的問題是，該複選框失去它的更新後的重點;您原本就需要重新調整已更改的項目的焦點 – Mathletics

不要在更改事件中調用render，創建一個新的函數（update？），它不會完全替換HTML –

@CoryDaniels然後我必須自己操縱DOM，這是問題骨幹正在嘗試解決的問題...... –

這裏是什麼我結束瞭解決方案： -

它增加了所有元素生成的ID沒有一個ID，這些ID將是相同的狀態模型相同

render: function(x) { 
    var html = this.options.template(this.model.toJSON()); 
    var focused = window.document.activeElement.id; //Get the focused element 
    this.el.innerHTML = html; 
    this.decorate(); 
    if (focused) $('#' + focused).focus(); //Focus if previously focused prior to innerHTML 
    return this; 
}, 

decorate: function() { 
    var i = 0; 
    var idPrefix = 'ENTER PREFIX HERE' 
    this.$el.find('*').each(function() { 
    if (!this.id) this.id = idPrefix + ((++i).toString(36)); //Add id if none exists 
    }); 
}

來源

2013-05-17 11:30:04

使用backbone.js時導致鍵盤選項卡導航斷開

回答

相關問題