在同一页面上打开另一个代码的按钮

Question

我需要在 Confluence 上创建 google 搜索的演示，因此代码在 HTML 宏中。目前我的代码是：

<div id="central"> <img src="https://www.google.com/images/srpr/logo5w.png" title="Google"> 
<form>
<input type="text" title="Search" value="For example, WordPress hosting"> 
<input type="submit" onclick="window.open('my url')" value="Google Search" /> 
<input type="submit" onclick="window.open('my url')" value="I'm feeling lucky" /> 
</form> 
</div>

现在，如果用户点击 Google 搜索或我感觉很幸运“按钮”，他们将被重定向到搜索结果或我需要的页面。

是否可以在同一页面上点击打开另一个代码？就像只有演示所需链接的假搜索结果一样。对我来说，问题是代码应该放在 Confluence 上的同一个 HTML 宏中，我不能创建其他文档。

Answer 1

你可以简单地使用 javascript 切换

HTML

<div id="central"> <img src="https://www.google.com/images/srpr/logo5w.png" title="Google"> 
<form>
<input type="text" title="Search" value="For example, WordPress hosting"> 
<input type="button" onclick="myFunction()" value="Google Search" /> 
<input type="button" onclick="myFunction()" value="I'm feeling lucky" /> 
</form>
</div>
<div id="myDIV" style=" display: none;">
This is a DIV element.
</div>

CSS

.mystyle {
width: 100%;
padding: 25px;
background-color: coral;
color: white;
font-size: 25px;
}

JavaScript

function myFunction() {
var x = document.getElementById("myDIV");
if (x.style.display === "none") {
x.style.display = "block";
} else {
x.style.display = "none";
}
}

在同一页面上打开另一个代码的按钮

Button to open another code on the same page

html

onclick

button