Question

下面是一个人为的示例，隔离了我的问题。如果字符数为偶数，则会显示一个简单的文本字段，并显示一条消息。如果我将消息移到文本字段下面，似乎态态只能看到文本字段的值已更改，因此它不会重建输入节点，这意味着控件将保持焦点。如果我将消息保留在文本字段上方，尽管事实是我指定了id，但morphdom仍会重建控件。

从文档中...

https://github.com/patrick-steele-idem/morphdom

此外，此模块使用的算法将自动匹配在原始DOM树和目标DOM树中都具有对应ID的元素。

代码示例...

https://codepen.io/anon/pen/NOvZJz

cv::Mat result(frame.rows,frame.cols,CV_8UC1);

编辑

当前的行为是，如果您在该字段中键入1个字符，则文本字段将保持焦点（良好），但是如果您在该字段中键入第二个字符，则显示“甚至字符数！”。消息显示文本字段失去焦点（坏）。

所需的行为是，即使显示消息，文本字段也应保持焦点。

Answer 1

使用.focus()将id添加到输入中。
看到这个https://www.w3schools.com/jsref/met_text_focus.asp

解决方案

查看更新后的代码，

input.addEventListener("input", function(e) {
      text = e.target.value;
      var newRootDiv = createView();
      morphdom(origRootDiv, newRootDiv);

      // added the input with Id here
      document.getElementById('this-should-help-right').focus();
    });

我在document.getElementById('this-should-help-right').focus();通话后添加了morphdom。所以我认为问题已经解决

为什么这个文本字段失去了词素焦点？

1 个答案:

解决方案