Question

我开始道歉，因为这可能看似或实际上是重复的，但我已经尝试过我遇到过的所有解决方案，而且似乎都没有为我工作。

在我的HTML中，我有一个iframe引用另一个HTML文档。使用JavaScript，按下按钮列表，我将文本插入到iframe的正文中。我还使用JavaScript来保持对iframe主体的关注。问题是，每当我按下这些按钮时，没有任何东西可以让光标移动到文本的末尾，它总是移动到开头。

我尝试过的解决方案之一是将此代码添加到处理按钮按下的功能中：

iFrameBody.focus();
var content = iFrameBody.innerHTML;
iFrameBody.innerHTML = content;

所以函数看起来像这样：

function typeIn(buttonId) {

    var iFrameBody = document.getElementById("iFrame").contentWindow.document.body;
    iFrameBody.innerHTML += buttonId;

    iFrameBody.focus();
    var content = iFrameBody.innerHTML;
    iFrameBody.innerHTML = content;
}

我尝试的其他内容是，在我的iframe引用的HTML文件中：

<body onfocus="this.innerHTML = this.innerHTML;"></body>

我尝试了其他几个更复杂的解决方案，坦率地说，我甚至不太明白，说实话，一切都无济于事。任何帮助将不胜感激。

Answer 1

我明白了。问题是我使用了一个body元素，写了它的innerHTML并试图将注意力集中在身体上。通过简单地在我的iFrame中使用textarea，它变得非常简单，只需要最简单的代码。

这可以在页面加载时设置焦点：

window.onload = function () {

    var iFrameTextArea = document.getElementById("iFrame").contentWindow.document.getElementById("iFrameTextArea");
    iFrameTextArea.focus();
}

然后将此按钮设置为在保持焦点的同时写入textarea：

function typeIn(buttonId) {

    var iFrameTextArea = document.getElementById("iFrame").contentWindow.document.getElementById("iFrameInput");

    iFrameTextArea.focus();

    iFrameTextArea.value += buttonId;

}

超级简单!!

Answer 2

您可以使用以下代码解决此问题，而不是再次在iframe中使用textarea。

var iframeElement = document.getElementById("iFrame").contentWindow.document.body;
            iframeElement.focus();
            var len = iframeElement.length ;
            iframeElement.setSelectionRange(len, len);

使用JavaScript

2 个答案: