javascript - KnockoutJS 数据绑定：从 javascript 点击点击

Question

假设我们有一张桌子

<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 没有。有任何想法吗？

Answer 1

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>

Answer 2

我看到代码有两个问题：

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

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

您的 foreach 绑定与硬编码的“锚” ID 相结合将产生多个元素的 ID 为锚。这是一个禁忌。也许使用“anchor”类而不是“anchor”的 id。

<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/

Answer 3

<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(element) - 返回可用于绑定元素的数据

你可以看看这个链接