Question

我对编码有点新意。我试图将JavaScript放在我的谷歌网站的HTML框中，但它无法正常工作。我在这里粘贴我的代码。

<!DOCTYPE html>
<html>
<body>

<p>Click the button to display an alert box:</p>

<button onclick="myFunction()">Try it</button>

<script>
function myFunction() {
    alert("I am an alert box!");
}
</script>

</body>
</html>

它应该使用警告框进行验证。当我在localhost上运行它时，代码运行正常，但是当我在google站点的HTML框中粘贴代码时，代码运行不正常。我的公司正在使用Google小工具来制作HTML和javascript在google网站上运行。没有谷歌小工具有没有更简单的方法吗？

Answer 1

也许您不应该在小部件框中粘贴<html>和<body>标记，因为它已经是html文档的一部分。

只需尝试一下：

<button onclick="alert('I am an alert box!');">Try it</button>

Answer 2

您可以使用类似于警报方法的方法对 div 进行编程。根据需要对其进行样式化和定位，但这里有一个我称为 msgBox 的示例，它接收消息和类型（仅更改关键、警告和信息的颜色）并像横幅一样显示在文档顶部:

<!DOCTYPE html>
<html>
<head>
<style>
  .msgBox{position:absolute;width:50%;top:0px;left:-25%;margin-left:50%;padding:1%;color:black;display:none;font-family:"Calibri","Arial",sans-serif;vertical-align:middle;}
  .info{background-color:rgba(120,170,250,0.95);}
  .warn{background-color:rgba(240,230,120,0.95);}
  .crit{background-color:rgba(250,120,120,0.95);}
  .msgBoxMessage{width:98%;max-width:98%;height:100%;color:black;font-size:1.8vw;vertical-align:middle;}
  .msgBoxClose{height:100%;color:black;font-weight:bold;font-size:3vw;cursor:pointer;transition:0.2s;vertical-align:middle;}
  .msgBoxClose:hover{color:white;transition:0.2s;}
</style>
<script>
  function msgBox(message, type) {
    var msgBox = document.getElementById("msgBox");
    var msgBoxMessage = document.getElementById("msgBoxMessage");
    msgBoxMessage.innerHTML = message;
    msgBox.style.display="block";
    msgBox.className="msgBox " + type.toLowerCase();
  }
</script>
</head>
<body>
<h2>This page shows how to drive messages without using javascript alert.</h2>
<div class="msgBox info" id="msgBox">
  <table style="width:100%;">
    <tr>
      <td class="msgBoxMessage" id="msgBoxMessage"></td>
      <td class="msgBoxClose" onclick="document.getElementById('msgBox').style.display='none';">&times;</td>
    </tr>
  </table>
</div>
<button onclick="msgBox('This is for your <u>information</u>.', 'info');">Info</button>
<button onclick="msgBox('This is just a <i>warning</i>.', 'warn');">Warn</button>
<button onclick="msgBox('This is a <b>critical</b> message!', 'crit');">Crit</button>
</body>
</html>

Google协作平台上的Javascript

2 个答案: