首页 > 解决方案 > 带有 iframe 的 Html 代码在 Mozilla 和 Edge 中不起作用

问题描述

我是编码新手,我正在实现聊天机器人,它在 chrome 中运行良好。但是当我在 mozilla 和 edge 中尝试时,当我提供输入时,它并没有接受输入。以下是我在边缘检查元素时遇到的错误。谁能告诉我我做错了什么,请告诉我是否需要对代码进行任何更改。

在此处输入图像描述

这是我的html代码。

// Get the modal
var newmodal = document.getElementById('myModal');

// Get the button that opens the modal
var btn = document.getElementById("myBtn");

// Get the <span> element that closes the modal
var span = document.getElementsByClassName("close")[0];

// When the user clicks the button, open the modal 
btn.onclick = function() {
  newmodal.style.display = "block";
}
// When the user clicks on <span> (x), close the modal
span.onclick = function() {
  newmodal.style.display = "none";
}

// When the user clicks anywhere outside of the modal, close it
window.onclick = function(event) {
  if (event.target == modal) {
    modal.style.display = "none";
  }
}
.newmodal {
  width: 300px;
  background-color: white;
  position: absolute;
  bottom: 41px;
  right: 43px;
  display: none;
}

.click-meq {
  height: 60px;
  width: 60px;
  position: absolute;
  bottom: 10px;
  right: 10px;
}

img {
  position: fixed;
  bottom: 15px;
  right: 15px;
  height: 60px;
  width: 60px;
}

.click-me1 {
  height: 40px;
  background-color: blue;
  color: white;
  width: 300px;
  position: absolute;
  bottom: 0;
  right: 10px;
}
<title>Bootstrap Example</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>


<div class="container-fluid">
  <div class="newmodal" id="myModal">
    <div class="close-btn">
      <span class="close">&times;</span>
    </div>

    < "MY Iframe Here">
  </div>
  <button class="click-me" id="myBtn"><img src="C:\Users\Resemble\Downloads\chat1.png"></button>
</div>

标签: htmliframe

解决方案


推荐阅读