2016-04-29 35 views
0

我有一個簡單的多個列表框。我正在嘗試改變淘汰賽中選項的顏色,似乎找不到方法。請協助。在點擊一個項目時,項目不應該用默認的藍色高亮顯示。有沒有辦法?使用knockout.js更改多個列表框中的顏色或選定項目

這裏是我的fiddle

var Customer = function (id, name, expired) { 
     this.id = id; 
     this.customerName = name; 
     //this.expiryDate = expiryDate; 
     this.hasExpired = function() { 
      return expired; 
     }; 
    }; 

    function ViewModel() { 
     var self = this; 
     self.customerRegion = ko.observable(); 
     self.customerName = ko.observable(); 

     self.allCustomers = [new Customer(1, "User1", false), new Customer(2, "User2", true), new Customer(3, "User3", false)] 
     self.selectedCustomer = ko.observable() 

     self.setOptionStyling = function (option, item) { 
      console.log(item.hasExpired()) 
      ko.applyBindingsToNode(option, { 
       css: { 
        expired: item.hasExpired() 
       } 
      }, item); 
     } 
    } 
    ko.applyBindings(new ViewModel()) 

我的HTML:

<select multiple = "multiple" id="customerSelect" 
      data-bind="options: allCustomers, 
      optionsText: 'customerName', 
      value: selectedCustomer, 
optionsAfterRender: setOptionStyling"" /> 
+0

我認爲你有一個* CSS *的問題,而不是一個knockout.js問題?在我看來,你想改變所選項目的樣式(例如藍色背景)。因此,這似乎是[這個問題]的僞裝(據我所知)?據我所知,你不能用html/css來做到這一點。你需要一個下拉式替換庫/小部件。 – Jeroen

+0

[如何更改選擇框下拉上的藍色突出顯示的顏色]可能的重複(http://stackoverflow.com/questions/19388011/how-to-change-colour-of-blue-highlight-on-select-box-落下) – Jeroen

回答

相關問題