我有这个HTML:
<div id="accordion" data-bind="jqAccordion: { },template: { name: 'tb-template', foreach: Items, afterAdd: function(elem){$(elem).trigger('valueChanged');} }" class="group accordion ui-widget ui-helper-clearfix" ></div>
使用模板:
<script type="text/html" id="tb-template" >
<div data-bind="attr: {'id': 'Text' + TextId}, click: $root.SelectedText" class="group ui-widget-content ui-corner-tr" >
<div class="accordion-header ui-widget-header">
<table>
<tbody>
<tr>
<td><span data-bind="text:Title"></span></td>
</tr>
</tbody>
</table>
</div>
</div>
</script>
当点击我的项目列表中的每个元素时,我会显示一个包含项目信息的div:
<div class="" data-bind="with: SelectedText">
<label>Id:</label><span data-bind="text: Id"></span>
<h1 data-bind="text: Title"></h1>
<label>Description:</label><span data-bind="value: Description" class="description"></span>
</div>
最后一个div正在响应手风琴中的click-event。现在我想让它响应鼠标悬停/悬停而不是点击。我试图只是切换事件名称,但这显然不起作用。我怎样才能以我想要的方式做出回应?
答案 0 :(得分:1)
参考http://knockoutjs.com/documentation/event-binding.html有关如何正确使用事件绑定的更多详细信息。
<div data-bind="attr: {'id': 'Text' + TextId}, event:{ mouseover: $root.SelectedText}" class="group ui-widget-content ui-corner-tr" >
上面的代码将启用手风琴中的下一个元素。请记住,这只会启用下一个元素,你需要一个非常大的编辑来实际让它在mouseout上禁用。