Javascript 防止下拉菜单更改敲除

我正在尝试创建一个包含添加、删除和绑定的网格模板，与教程中的模板非常相似

在这个模板中，我想让每个下拉列表都有一个唯一的值-即，没有重复的值-所以我尝试将逻辑添加到更改块中

如果我使用jquery，为了处理事件，我可能会尝试绑定到更改，并确定该值当前是否由另一个下拉列表选择，如果发生，则防止使用默认值

使用敲除是否可能出现同样的行为

我的事件正在触发，但我无法防止违约

相关代码如下所示

HTML

请参阅小提琴，了解真实的示例

我是超级新手，非常适合淘汰赛

无论如何，我不知道该如何按照你的意愿停止这项活动。但是，如果用户尝试选择以前选择的类型，则可以存储以前的值，然后更改回：

function PhoneNumber(type, number, comment) {
    var self = this;

    self._type = type;    
    self.type = ko.observable(type);
    self.number = number;
    self.comment = comment;
}

function PhoneNumbersViewModel() {
    var self = this;

    self.subTitle = ko.observable("Call Me Maybe");

    self.PhoneTypes = [
        { name: "Fax" },
        { name: "Home" },
        { name: "Mobile" },
        { name: "Work" }
    ];    

    self.phoneNumbers = ko.observableArray([
        new PhoneNumber(self.PhoneTypes[0], "500-555-5555", "Phoney")
    ]);

    self.addPhoneNumber = function() {
        self.phoneNumbers.push(new PhoneNumber(self.PhoneTypes[0], "", ""));
    }

    self.removePhoneNumber = function(number) {
        self.phoneNumbers.remove(number);
    }

    self.clearSubtitle = function(){ this.subTitle(""); }

    self.changeType = function(data, event){
        if(self.phoneNumbers().some(function(number) {
            return number != data && number.type().name == data.type().name;
        })) {
            data.type(this._type);
        } else {
            this._type = data.type();
        }
    };
}

---

这无法修复新项设置为可能已被选中的类型的问题，但这不是您所要求的。

我不确定您是否感兴趣，但我想出了一个解决问题的替代方案-我删除了不应该从下拉列表中选择的项目。这有点复杂。看见

  self.changeType = function(data, event){
      return false;
  };

function PhoneNumber(type, number, comment) {
    var self = this;

    self._type = type;    
    self.type = ko.observable(type);
    self.number = number;
    self.comment = comment;
}

function PhoneNumbersViewModel() {
    var self = this;

    self.subTitle = ko.observable("Call Me Maybe");

    self.PhoneTypes = [
        { name: "Fax" },
        { name: "Home" },
        { name: "Mobile" },
        { name: "Work" }
    ];    

    self.phoneNumbers = ko.observableArray([
        new PhoneNumber(self.PhoneTypes[0], "500-555-5555", "Phoney")
    ]);

    self.addPhoneNumber = function() {
        self.phoneNumbers.push(new PhoneNumber(self.PhoneTypes[0], "", ""));
    }

    self.removePhoneNumber = function(number) {
        self.phoneNumbers.remove(number);
    }

    self.clearSubtitle = function(){ this.subTitle(""); }

    self.changeType = function(data, event){
        if(self.phoneNumbers().some(function(number) {
            return number != data && number.type().name == data.type().name;
        })) {
            data.type(this._type);
        } else {
            this._type = data.type();
        }
    };
}