jQuery的淘汰賽 - 獲取數據綁定屬性

內部元件例如我在哪裏綁定使用jQuery淘汰賽的CSS類select元素。jQuery的淘汰賽 - 獲取數據綁定屬性

我想直接從data-bind屬性訪問當前元素實例，而不在ViewModel屬性（因爲我有很多select元素共享相同的功能）

這可能嗎？

<select id="select1" data-bind="css: { 'no-value-selected': $item.val() == '' }"> 
    <option value="">[Select a value]</option> 
    <option value="1">1</option> 
    <option value="2">2</option> 
</select>

編輯使用視圖模型來實現這一點（我想避免）

function ViewModel() { 
    this.select1HasNoValueSelected = ko.computed(function() { 
     return $("#select1").val() == ''; 
    }, this); 
}; 
var viewModel = new ViewModel(); 
ko.applyBindings(viewModel); 

<select id="select1" data-bind="css: { 'no-value-selected': select1HasNoValueSelected }">

來源

2013-04-16 Catalin

不是100％肯定你問在這裏，你能解釋一下你的方案更好一點？通過DOM輕鬆完成「訪問當前元素實例」？ –

我在我的問題中添加了一個工作示例..希望更清楚 – Catalin

這實際上是一個非常困難的問題，我會繼續嘗試破解它。 –

你是在錯誤的軌道與css約束力的，因爲如果你不使用觀測，如果你的選擇的價值變動將不會更新您的類。

但是你可以（小姐）使用event結合和改變事件訂閱：

<select id="select1" class="no-value-selected" data-bind="event: { 'change': 
function() { $($element).val() == '' ? 
      $($element).addClass('no-value-selected') : 
      $($element).removeClass('no-value-selected') } }"> 
    <option value="">[Select a value]</option> 
    <option value="1">1</option> 
    <option value="2">2</option> 
</select>

演示JSFiddle.（第二個下拉）

但是，最好的解決方案是不反對淘汰賽打併具有屬性爲每個在你的視圖模型選擇：

function ViewModel() {  
    this.select1Value = ko.observable() 
}; 

<select id="select1" data-bind="css: { 'no-value-selected': !select1Value() }, 
           value: select1Value"> 
    <option value="">[Select a value]</option> 
    <option value="1">1</option> 
    <option value="2">2</option> 
</select>

演示JSFiddle.（第三個下拉）

還是沒有此功能使用Kncokout可言。

來源

2013-04-16 09:09:36 nemesv

這是正確的..我沒有使用observables不會觸發價值變化的css值。第二種解決方案完美運行 – Catalin

如果您想爲所有選擇使用通用解決方案，則可以使用自定義綁定。 –

你可以嘗試使用$element而不是$item：

<select data-bind="css: { 'no-value-selected': $element.val() == '' }"> 
    <option value="">[Select a value]</option> 
    <option value="1">1</option> 
    <option value="2">2</option> 
</select>

文檔：http://knockoutjs.com/documentation/binding-context.html

來源

2013-04-16 08:42:07

不，$元素沒有定義 – Catalin

jQuery的淘汰賽 - 獲取數據綁定屬性

回答

相關問題