在动态knockoutJS绑定之后使用JQuery

在knockoutJS动态绑定之后，有没有一种方法可以使用JQuery

例如：

或者不管是什么JQuery转换，它都不会发生。我假设绑定是在所有执行之后完成的。因此，没有声明美元（“#phone”）

有没有办法将JQuery应用于此元素

---

谢谢

正确的方法不是使用jQuery，而是使用KnockoutJS的禁用绑定

在数据绑定字段中，设置ID的属性值和禁用绑定。例如：

data-bind="attr: {id: field_id}, disable: disableFlag"

然后在您的视图模型上，确保您有一个可观察的ko来驱动它，例如：

this.disableFlag = ko.observable(false);

请确保在声明时实际使用了提示值，以便KO能够正确地确定事情

更新 让这更容易理解。如果您将其用于动态填充的列表，那么可能值得为行创建实际的视图模型

当我第一次开始使用knockout时，我习惯于直接从我从后端获取的JSON创建行，但我很快发现，在使实际模型完全按照我所希望的方式工作时，我遇到了很多问题，因此我开始为主视图模型中的行编写具体的视图模型

我还发现将模型组合为独立对象更好

通常，对于行视图模型，我将从以下内容开始：

var RowViewModel = (function ()
{
  function RowViewModel(inputRecord)
  {
    this.RecordId = ko.observable(0);
    this.Name = ko.observable('');
    this.SomeOtherData = ko.observable('');
    this.disabledFlag = ko.observable(false);
    ko.mapping.fromJS(inputRecord, {}, this);
  }

  return RowViewModel;
})();

然后，我为主表、列表或我正在填充的重复结构构建一个更大的视图模型，如下所示：

var MainViewModel = (function ()
{
  function MainViewModel(targetElement)
  {
    this.loadComplete = ko.observable(false);
    this.tableRows = ko.observableArray([]);

    ko.applyBindings(this, targetElement);
    $.support.cors = true;
  }

  IndexViewModel.prototype.Load = function ()
  {
    $.getJSON("/some/place/to/get/data_from", function (data)
    {
      if (data.length > 0)
      {
        _this.tableRows(ko.utils.arrayMap(data, function (item)
        {
          return new RowViewModel(item);
        }));
      } else
      {
        _this.tableRows([]);
      }
      _this.loadComplete(true);
    });
  };

  return IndexViewModel;
})();

如您所见，在主视图模型中，我们使用ko实用程序函数将传入数据映射到行视图模型集合

---

由于每行上都有一个disabled标志，因此将其设置为true以禁用该行，将使该实际行处于禁用状态，而无需jQuery。

Shawty感谢您的回答。我遇到的问题有点不同（因此需要JQuery）。我需要在选中复选框或选择值时禁用字段（禁用并隐藏，将来可能会进行其他转换）。我的方法是为这些特殊场合添加硬编码JQuery。尽管disableFlag目前可能是一个解决方案。谢谢基于复选框添加内容非常容易。只需添加一些可以绑定到绑定到行视图模型的复选框中的内容，然后将其和禁用标志包装在一个计算的可观察对象中，瞧，一个符合您要求的复选框。：-）

var RowViewModel = (function ()
{
  function RowViewModel(inputRecord)
  {
    this.RecordId = ko.observable(0);
    this.Name = ko.observable('');
    this.SomeOtherData = ko.observable('');
    this.disabledFlag = ko.observable(false);
    ko.mapping.fromJS(inputRecord, {}, this);
  }

  return RowViewModel;
})();

var MainViewModel = (function ()
{
  function MainViewModel(targetElement)
  {
    this.loadComplete = ko.observable(false);
    this.tableRows = ko.observableArray([]);

    ko.applyBindings(this, targetElement);
    $.support.cors = true;
  }

  IndexViewModel.prototype.Load = function ()
  {
    $.getJSON("/some/place/to/get/data_from", function (data)
    {
      if (data.length > 0)
      {
        _this.tableRows(ko.utils.arrayMap(data, function (item)
        {
          return new RowViewModel(item);
        }));
      } else
      {
        _this.tableRows([]);
      }
      _this.loadComplete(true);
    });
  };

  return IndexViewModel;
})();