HTML/JS 在半頁打開新的 url

Question

我正在使用 HTML、CSS 和 Javascript。 我的頁面分為兩個垂直列。 在右側，我有一些按鈕，單擊時會在左側添加一個句子。 我想要做的是，當我點擊一個按鈕時，左邊的句子被打印出來，右邊的內容發生了變化。 我試着制作一個新的 url，但它改變了整個頁面的內容。

編輯：我想做的就像餐館使用的軟件（銷售點）。 一側是收據，另一側是服務員點擊食物和飲料的位置，它們出現在收據上。

這是我所擁有的，但都不是關於列內容的新變化：

 function artfato() { var x = document.getElementById("myDIV"); x.innerHTML = "1 Fato" }

 <div class="row"> <div class="column" style="background-color:#bbb;"> <h3>Ticket nº1</h3> <p id="myDIV"></p> </div> <div class="column"> <table id="table"> <tr> <td> <input type="button" value="Fatos" class="ixbt" onclick="artfato();"> </td> <td> <input type="button" value="Calças" class="ixbt" onclick="artfato();"> </td> </tr> </table> </div> </div>

Answer 1

看來您的代碼當前正在更改id="myDiv"的內容。 不確定您要查找的確切內容，但您很可能希望對您的每一列或其中一列 append 一些東西，而不是覆蓋它。

Answer 2

我不確定您是否正在尋找它，但這里是 go。

首先，將“myDiv”從段落更改為 div。

<div id=myDiv></div>

在此之后，您可以將事件 function (artfato) 更改為如下內容：

var x = document.getElementById("myDIV");
var makeIframe = document.createElement("iframe");
makeIframe.setAttribute("src", "http://aol.com");
makeIframe.setAttribute("scrolling", "no");
makeIframe.style.border = "none";
makeIframe.style.left =  "-453px";
makeIframe.style.top = "-70px";
makeIframe.style.position = "absolute";
makeIframe.style.width = "1440px";
makeIframe.style.height = "775px";

x.appendChild(makeIframe);
style.position = "relative";
makediv.style.overflow = "hidden";

不要忘記設置 position 屬性相對和絕對，以維護 div 內的 iframe。

如果您想從自己的來源（域/應用程序）獲取內容，請嘗試以下操作：

<iframe sandbox="allow-forms allow-same-origin allow-scripts" src="https://yoururl.com/"></iframe>

字體： stackoverflow 答案