Question

我是Knockout.js的新手。

我有一个代码片段，它基本上会在点击图片按钮时打开一个模态。由于某种原因，它不能用于按键。

这是初始代码：

<div class="text-center tooltip-lg">
    <a class="tooltip-container" tabindex="0">
        <i class="icon icon-pencil dynamic-icon tooltip_trigger" title="edit" data-toggle="modal" data-target="#assessment_type_modal" data-placement="top" data-bind="click: $root.opt.openModalForEdit"></i></a></div>

由于缺少按键或键盘事件，我做了以下更改。

<div class="text-center tooltip-lg">
    <a class="tooltip-container" tabindex="0">
        <i class="icon icon-pencil dynamic-icon tooltip_trigger" title="edit" data-toggle="modal" data-target="#assessment_type_modal" data-placement="top" data-bind="event: { click: $root.opt.openModalForEdit, keypress: $root.opt.openModalForEdit }" ></i></a></div>

按键不会触发动作。我也尝试过keyup（在stackoverflow中的一些问题中提到过。），这也没有用。

The Model looks like this: 

viewModel.opt = {
    openModalForNew: function () {
        // Some code
    },
    openModalForEdit: function (assessmentType) {
        // Some code
    },
    saveModal: function () {
        // Some code
    },
    removeAsmtType: removeAsmtType
};

更新：操作已被识别，但不知道未触发事件的原因。当我运行下面的测试用例时，每当我将鼠标悬停在该标签上时，测试就会打印在控制台上。

<div class="text-center tooltip-lg">
    <a class="tooltip-container" tabindex="0">
        <i class="icon icon-pencil dynamic-icon tooltip_trigger" title="edit" data-toggle="modal" data-target="#assessment_type_modal" data-placement="top" data-bind="event: { click: $root.opt.openModalForEdit, 'mouseover' : function () { console.log('TEST'); return true; }" ></i></a></div>

任何人都可以建议我做错了什么。浏览器控制台中也没有显示错误。

提前致谢。

Answer 1

在具有焦点的元素上触发keypress事件，即：具有tabindex（或甚至contenteditable）属性的元素或自动支持它（如任何{{ 1}}元素）。

您可以通过将<input>绑定移至event: { keypress: ... }的{{1}}元素来解决您的问题。

<a>

tabindex=0

如何将两个事件绑定到knockout.js中的元素

1 个答案: