Question

所以我在聊天应用程序上工作，我想添加表情符号。所以我使用了两个html页面。第一个包含文本区域，当我们调用消息时，iframe引用第二个html页面。

<div class="col-12">
   <textarea  class="col-12 row-12 var_MessageInput" id="textmsg" placeholder="Write a reply..."></textarea>
</div>

在第二个html页面中我有笑脸图片</ p>

<img src="../../../images/sad_smile.gif"   onclick="insertSmiley('sad');"/>
<img src="../../../images/angel_smile.gif" onclick="insertSmiley('angel');"/>
<img src="../../../images/happy_smile.gif" onclick="insetSmiley('happy');" />

所以我希望当我点击笑脸图片时，我的文字区域中插入了文字，所以我使用了以下脚本

function insertSmiley(smiley) {
  var currentText = document.getElementById("textmsg");
  var smileyWithPadding = " " + smiley + " ";
  currentText.value += smileyWithPadding;
  currentText.focus();
}

但它确实起作用:(我认为问题可能在document.getElementById中，因为它是另一个html页面，但我不知道如何解决它。非常感谢

Answer 1

onclick="insetSmiley('happy');"中有一个输入错误，应该是onclick="insertSmiley('happy');"。我检查了它，它对我有用。

Answer 2

在您的JS代码中，使用：

window.location = "second_HTML_Page.html" ;

Answer 3

问题是当在iFrame中触发函数时，范围变得复杂。

解决方案是通过在window级别定义函数 global 。然后当在iFrame中触发该函数时，它可以调用iFrame的父级（主窗口）的函数。

示例小提琴：http://jsfiddle.net/e37rrtb1/2/

如何链接两个html页面

3 个答案: