KnockoutJS数据绑定:从javascript点击中点击

KnockoutJS data-bind: click from javascript click

本文关键字：javascript 数据绑定 KnockoutJS      更新时间：2023-09-26

假设我们有一个这样的表

<table>
    <tbody data-bind="foreach: orderItems">
        <tr class='datarow'>
            <td data-bind="text: whatever"></td>
            <td><a id='anchor' href='#' data-bind='click: $root.save' onclick='alert("a");'>Text</a></td>
        </tr>
    </tbody>
</table>

所以当我做时

document.getElementsById('anchor').click();

警报会触发，但$root.save不会。有什么想法吗？

Try This
<script type="text/javascript">
    var viewModel = {
        Save: function() {
            alret("Hello");
        }
    };
ko.applyBindings(new MyViewModel());
</script>
<table>
    <tbody data-bind="foreach: orderItems">
        <tr class='datarow'>
            <td data-bind="text: whatever"></td>
            <td><a id='anchor' href='#' data-bind='click: $root.save' onclick='alert("a");'>Text</a></td>
        </tr>
    </tbody>
</table>

我看到代码有两个问题：

  1. getElementsById-你确定这个方法存在吗

每个ID在页面上只能存在一次。当你想通过元素的ID找到元素时，你可以调用getElementById(单数(，它会返回一个元素。因为只有一个元素应该具有给定的ID，所以没有getElementsById(复数(方法。

foreach绑定与硬编码的"anchor"id相结合将导致多个id为anchor的元素。这是一个禁忌。也许使用一个类"anchor"而不是一个id"anchor"。

<a class='anchor' href='#' data-bind='click: $root.save' onclick='alert("a");'>Text</a>

所以我的猜测是getElementsById没有返回任何可点击的内容。

  1. 单击((

即使您能够从getElementsById中取回一个元素，这些元素上也没有click((方法。

作为替代方案，您可以使用jQuery来获取元素，使用jQuery对象可以调用click((方法。或者，您可以获取从getElementById返回的元素，将其封装在jQuery中，然后调用click((。

$('.anchor').click();

以下是一个工作示例：http://jsfiddle.net/tlarson/t4yZL/1/

<table>
    <tbody data-bind="foreach: orderItems">
        <tr class='datarow'>
            <td data-bind="text: whatever"></td>
            <td><a id='anchor' href='#' onclick='alert("a"); viewModel.save(ko.dataFor(this));'>Text</a></td>
        </tr>
    </tbody>
</table>
  • 假设您将viewModel存储在其他地方
  • ko.dataFor(元素(-返回可用于绑定元素的数据

你可以看看这个链接

相关文章：