gpt4 book ai didi

javascript - 将 JavaScript 输出移动到其他区域

转载 作者:太空宇宙 更新时间:2023-11-03 22:36:27 24 4
gpt4 key购买 nike

我无法将我的 JavaScript 输出 (start) 从黑框移动到灰框。我不完全确定将什么放入函数(moveRightmoveLeft)以使输出从一个移动到另一个。

我曾尝试搜索解决方案,但未能找到。我确信有更好的方式来呈现此代码,但我目前仍在学习基础知识。谢谢。

function start() {
var txt;
var person = prompt("Please enter your name:", "");
if (person == null || person == "") {
txt = "User cancelled the prompt.";
} else {
txt = person;
}
document.getElementById("text").innerHTML = txt;
}

function moveRight(start) {

}

function moveLeft(start) {

}
.blackbox {
width: 250px;
height: 125px;
background: #000000;
float: left;
color: white;
text-align: center;
height: 90px;
line-height: 90px;
}

.greybox {
width: 250px;
height: 125px;
background: #323232;
float: left;
text-align: center;
height: 90px;
line-height: 90px;
}

.button {
position: relative;
float: left;
padding-left: 10px;
}

.part3 {
position: relative;
float: left;
}
<div id="part3">
<button type="button" onclick="start()">Start</button>
<button type="reset">Clear</button><br><br><br>

<div class="part3">
<div class="blackbox" id="text"></div>
<div class="button">
<br>
<button type="button" onclick="moveRight(start)">--></button><br><br>
<button type="button" onclick="moveLeft(start)"><--</button>
</div>
<br><br>
<div class="greybox" id="name"></div>
</div>
</div>

最佳答案

此代码使按钮在黑框和灰框之间交换值

var txt;

function start() {
var person = prompt("Please enter your name:", "");
if (person == null || person == "") {
txt = "User cancelled the prompt.";
} else {
txt = person;
}
document.getElementById("text").innerHTML = txt;
}

function moveRight() {
document.getElementById('name').innerHTML = txt;
document.getElementById('text').innerHTML = '';
}

function moveLeft() {
document.getElementById('text').innerHTML = txt;
document.getElementById('name').innerHTML = '';
}
.blackbox{
width:250px;
height:125px;
background:#000000;
float: left;
color: white;
text-align: center;
height: 90px;
line-height: 90px;
}

.greybox{
width:250px;
height:125px;
background:#323232;
float: left;
text-align: center;
height: 90px;
line-height: 90px;
}

.button{
position: relative;
float: left;
padding-left: 10px;
}

.part3{
position: relative;
float: left;
}
<!DOCTYPE html>
<html lang="en">
<head>
<title>Test</title>
<meta charset="UTF-8">
</head>
<body>

<div id="part3">
<button type="button" onclick="start()">Start</button>
<button type="reset">Clear</button><br><br><br>

<div class="part3">
<div class="blackbox" id="text"></div>
<div class="button">
<br>
<button type="button" onclick="moveRight()" >--></button><br><br>
<button type="button" onclick="moveLeft()" ><--</button>
</div>
<br><br>
<div class="greybox" id="name"></div>
</div>
</div>

</body>
</html>

关于javascript - 将 JavaScript 输出移动到其他区域,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46303590/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com