Question

我正在开发一个需要与移动和桌面设备完全兼容的Web应用程序。我将click事件绑定到节点并将参数传递给viewmodel的函数，如下所示：

<a href="#" class='btn btn-danger' data-bind="click: bsDeleteModal.open.bind($data, 1)"><span>Delete</span></a>

它在桌面浏览器上正常运行，但在手机或平板电脑上却无法运行。我已经在平板电脑和手机上的Android原生浏览器，Windows Phone 8.1上的Internet Exporer 11，iPhone Safari和每个设备上的移动版Chrome上测试了此代码，但没有运气。

这是我的视图模型过度简化：

var DeleteModalViewModel = function(/*parameters....*/){
  var self = this;
  //parameters...
  self.open = function(position){
    alert("position: " + position);
  }
}

var vm = (function(){ //...my viewmodel...
  var self = this;
  self.bsDeleteModal = new DeleteModalViewModel(/*parameters...*/);

  //additional parameters...
})();

ko.applyBindings(vm);

knockoutjs 3框架中是否存在已知问题或错误，阻止我在移动设备上传递参数时绑定事件？
我也试过这样传递它：

<a data-bind="click: function(data, event){ bsDeleteModal.open.bind($data, 1) }" />

此外，我尝试在函数名称之前添加$ root，认为移动设备无法正确解析函数名称但没有运气。

<a data-bind="click: function(data, event){ $root.bsDeleteModal.open.bind($data, 1) }" />

非常感谢任何帮助。提前谢谢。

编辑：我忘了提及：我的html代码位于模板标记内，当页面加载时，该标记作为局部视图加载。这可能很重要，因为之前我遇到过动态模板绑定问题。

Answer 1

某些设备+浏览器组合可能不存在绑定功能。

这是一个ES5功能，如果它缺少需要填充

检查是否存在Function.prototype.bind

Answer 2

我设法在同事的帮助下解决了这个问题事实证明，问题与模板绑定有关，因为移动设备上的按钮呈现在页面“后面” 一旦我在css中将z-index为9999设置为按钮，绑定工作正常。

KnockoutJS - 使用不在移动设备上运行的参数单击绑定

2 个答案: