Edit in JSFiddle

<select data-bind="options: CreditCards,
    optionsText: function(item){return item.CardNumber + '(' + item.CardHolder + ')'},
    value: SelectedCard, optionsCaption: '請選擇'"></select>
<span data-bind="text: SelectedCard() ? SelectedCard().CardNumber : 'none'"></span> selected.

function ViewModel() {
    var self = this;
    self.CreditCards = ko.observableArray([{
        "CardId": 1,
            "CardNumber": "1234-5678-1234-0001",
            "CardHolder": "Pete"
    }, {
        "CardId": 2,
            "CardNumber": "1234-5678-1234-0002",
            "CardHolder": "Claire"
    }, {
        "CardId": 3,
            "CardNumber": "1234-5678-1234-0003",
            "CardHolder": "Pudding"
    }]);
    self.SelectedCard = ko.observable();
}

ko.applyBindings(new ViewModel());