Knockout JS-如何检测触发模糊的元素

Knockout JS - how to detect element that triggered blur?

本文关键字：模糊 元素 检测 JS- 何检测 Knockout      更新时间：2023-09-26

我试图在Knockout中更新条件模糊的输入值-基本上，我希望元素在特定元素触发模糊时不触发值更新。我知道我可以观察文档中每个元素的mousedown，并确定上次单击的内容，但似乎有点过分。有人能想到其他工作吗？

<input class="edit" data-bind="value: title, valueUpdate: 'afterkeydown', enterKey:     $root.stopEditing, selected: editing, event: { blur: $root.checkEditing }">

我试图实现这一目标的代码不适用于document.activeElement。

self.checkEditing = function( item, event ) {
        if (document.activeElement == $('a.cancel')) {
            // revert to previous title, aka cancel the editing
            item.title(item.previousTitle);
            item.editing( false );
        } else {
                            // this will update value with whatever was typed right before the blur
            item.editing( false );
            if ( !item.title().trim() ) {
                self.remove( item );
            }
        }
    };

为了适当地捕捉触发模糊的元素，必须使用setTimeout。模糊处理后，setTimeout确保聚焦元素可用。

例如：

输入：

<input class="edit" data-bind="value: title, valueUpdate: 'afterkeydown', selected: editing, event: { blur: $root.checkEditing, click: $root.editItem }">

模糊后检查活动元素的方法：

   self.checkEditing = function( item, event ) {
        setTimeout(function(){
            console.log("The active element is: " + document.activeElement)
            // check if the user selected cancel
            if ($(document.activeElement).is("a.cancel")) {
                // revert to previous title
                item.title(item.previousTitle);
            }
        });
        item.editing( false );
        if ( !item.title().trim() ) {
            self.remove( item );
        }
    };

完整的小提琴在这里演示：http://jsfiddle.net/hUA9v/5/

相关文章：