重新加载时多次调用订阅函数答案

【问题标题】：Subscribe function is called more than once when reload重新加载时多次调用订阅函数
【发布时间】：2015-10-26 12:08:45
【问题描述】：

我使用knockout的订阅功能来获取第一个下拉列表的选定值来绑定第二个下拉列表中的值。我将选定的下拉列表值存储在会话中，并在刷新时更改下拉列表的值。此时订阅被调用了两次，结果我在下拉列表中重复了每个值。

   self.getcountry = function () {         
        try {
     //code               
            $.ajax({
                //code
                statusCode: {
                    200: function (response) {                                   
                        $.each(response, function (index, data) {
                            self.country.push(data);
                        })
                        if(SESSIONVALUES!=null)
                        {
                             for (var i = 0; i < SESSIONVALUES.length; i++) {
                                var COUNTRYbind=SESSIONVALUES[i].vCOUNTRY;                           

                                $('#country option').filter(function () { return $.trim($(this).val()) == parseInt( COUNTRYbind); }).attr('selected', true);
                                $('#country ').change();                                 
                                self.selectedCountry(COUNTRYbind);// this is used to trigger the subscribe function       

                                                                }


                        }
                    }
                }
            });
        } catch (exception) { }
    };

这是订阅函数方法，

  self.selectedCountry.subscribe(function (newValue) {
        //code
        try {

            $.ajax({
               //code
                statusCode: {
                    200: function (response) {                           
                        $.each(response, function (index, data) {
                            self.state.push(data);
                        })
                        if(SESSIONVALUES!=null)
                        {
                            for (var i = 0; i < SESSIONVALUES.length; i++) {                       
                                var statebind=SESSIONVALUES[i].vstate;
                                $('#states option').filter(function () { return $.trim($(this).val()) == parseInt(statebind); }).attr('selected', true);
                                $('#states').change();

                            }
                        }
                    }
                }

            });
        } catch (Exception) { }

    });

【问题讨论】：

您应该使用您的视图模型来设置选项。
我很确定 $('#country ').change() 和 self.selectedCountry(COUNTRYbind);都会触发您的订阅事件。（不是 100% 我有一段时间没碰过淘汰赛）

标签： javascript jquery asp.net-mvc-4 knockout.js

【解决方案1】：

我在一小时前遇到了这个确切的问题！

试试这个：

ko.subscribable.fn.subscribeChanged = function (callback) {
    var oldValue;
    this.subscribe(function (_oldValue) {
        oldValue = _oldValue;
    }, this, 'beforeChange');

    this.subscribe(function (newValue) {
        callback(newValue, oldValue);
    });
};

然后您可以订阅，当它被触发时，您可以将 oldValue 与 newValue 进行比较。

例如在您的视图模型中

self.selectedCountry.subscribeChanged(function (newValue, oldValue) {
    if (newValue != oldValue) // Value has changed.
    {

希望这会有所帮助。

【讨论】：

oldvalue和newvalue会传入什么值？你能解释一下流程吗？
newValue 与您的示例中的值相同。 oldValue 是以前的值。有可能虽然它触发了两次，但如果值没有改变（例如当 newValue == oldValue 时），那么你可以放心地忽略它。可能是第一次触发 newValue != oldValue，第二次触发 newValue == oldValue。

【解决方案2】：

您使用的 jQuery 代码不属于那里。您的代码应该只更改视图模型元素，并且 Knockout 将使 DOM 反映视图模型。然后你就不必破解subscribable 并将你的代码变成某种无法支持的混搭。使用淘汰赛。

This example 可能会让您了解如何设置依赖选择列表。

【讨论】：

【解决方案3】：

只要加上“return false;”在函数结束时；

【讨论】：