KnockoutJs不会对自定义事件做出反应

我将我的ViewModel的isChecked属性绑定到data-whatever属性。此属性的值由jQuery的改变：KnockoutJs不会对自定义事件做出反应

$element.data('whatever', "true")

KnockoutJs没有注意到这个变化，我的ViewModel的属性不会改变。我如何让KnockoutJs注意到它？

我想类似的东西，但它没有工作：

JavaScript的 “视图层” 的剧本：

$element.data('whatever', "true") 
$element.trigger("myCustomEvent")

的观点：

<div data-bind="attr: { 'data-whatever': isChecked, event : {myCustomEvent: checkedFunction} }">

checkedFunction只是一个空方法在ViewModel中适合事件绑定语法。它仍然看起来像KnockoutJs不听myCustomEvent。

编辑

由于渔人建议我用$element.attr代替$element.data，但它仍然不能正常工作：

<html> 
<div id="test" data-bind="attr: { 'data-whatever': isChecked }">my div</div> 

<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script> 
<script src="http://knockoutjs.com/downloads/knockout-3.2.0.js"></script> 
<script> 
var vm = { 
    isChecked : ko.observable("one"), 
}; 

$(function() { 
    ko.applyBindings(vm); 
    console.log($('#test').attr('data-whatever')); // "one" 
    $('#test').attr('data-whatever', 'two'); 
    console.log($('#test').attr('data-whatever')); // "two" 
    console.log(vm.isChecked()); // // "one" again, thouh it should be "two" 
}); 

</script> 
</html>

即使我添加事件：

<html> 
<div id="test" data-bind="attr: { 'data-whatever': isChecked, event :{ myCustomEvent : aFunction }}">my div</div> 

<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script> 
<script src="http://knockoutjs.com/downloads/knockout-3.2.0.js"></script> 
<script> 
var vm = { 
    isChecked : ko.observable("one"), 
    aFunction : function(){ } 
}; 

vm.isChecked.subscribe(function(){ 
    console.log("hit the event"); // never happens 
}); 

$(function() { 
    ko.applyBindings(vm); 
    console.log($('#test').attr('data-whatever')); // "one" 
    $('#test').attr('data-whatever', 'two'); 
    $('#test').trigger('myCustomEvent'); 
    console.log($('#test').attr('data-whatever')); // "two" 
    console.log(vm.isChecked()); // "one" again, though should be "two" 
}); 

</script> 
</html>

来源

2014-10-01 gisek

你能编辑的问题，并创建一个[摄制]（http://sscce.org）？这会帮助你更轻松。 – Jeroen 2014-10-01 12:34:15

KO使用jQuery（如果可用）绑定到事件。这里是你可以调整的示例：http://jsfiddle.net/rniemeyer/Lf53moaa/ – 2014-10-01 13:37:39

@Jeroen添加了repro。请看一下。 – gisek 2014-10-01 16:43:15

您无法使用jQuery的data()函数设置data属性秒。看一看文档：http://api.jquery.com/data/

数据 - 属性被拉在第一时间将数据属性访问，然后不再访问或突变（所有数据值然后存储在内部的jQuery）

http://jsfiddle.net/prpL0x3j/

console.log($('#test').data('whatever')); 
// one 
$('#test').data('whatever', 'two'); 
console.log($('#test').data('whatever')); 
// two

退房的开发商栏中的DOM元素的属性 - 它不会改变，甚至ŧ hough jQuery的data值改变了。

考虑使用attr()功能：http://api.jquery.com/attr/

$element.attr('data-whatever', "true")

来源

2014-10-01 13:42:47 fischerman

关于jquery数据方法的好处。但不幸的是，它仍然无法正常工作。请看看编辑 – gisek 2014-10-01 16:45:12

KnockoutJs不会对自定义事件做出反应

回答

相关问题