我正在建立一个学校的时间表,现在得到了一个弹出窗口,你可以输入你的主题和它保存在一个变量.我怎么能让这个变量显示在其中一个按钮?这是我的HTML代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv= "X-UA-Compatible" content= "IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Schulplaner</title>
<link rel="stylesheet" href="style.css">
<script src="script.js" defer></script>
</head>
<body>
<header>
<div class="logo">Schulplaner</div>
<div class="hamburger">
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</div>
<nav class="nav-bar">
<ul>
<li>
<a href="Startseite.html" >Startseite</a>
</li>
<li>
<a class="active" href="Stundenplan.html">Stundenplan</a>
</li>
</ul>
</nav>
</header>
<main class="Stundenplan">
<div class="grid-container">
<div class="empty"></div>
<div class="Tage">Montag</div>
<div class="Tage">Dienstag</div>
<div class="Tage">Mittwoch</div>
<div class="Tage">Donnerstag</div>
<div class="Tage">Freitag</div>
<div class="Stunden">1.Stunde</div>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<div class="Stunden">2.Stunde</div>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<div class="Stunden">3.Stunde</div>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<div class="Stunden">4.Stunde</div>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<div class="Stunden">5.Stunde</div>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<div class="Stunden">6.Stunde</div>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<div class="Stunden">7.Stunde</div>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<div class="Stunden">8.Stunde</div>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<div class="Stunden">9.Stunde</div>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<div class="Stunden">10.Stunde</div>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<button type="button" class="btn" onclick="openPopup()"><strong>+</strong></button>
<div class="popup" id="popup">
<h2>Fach eingeben</h2>
<input type="text" id="fach"/>
<input type="color" />
<button type="button" onclick="Fach()">OK</button>
</div>
</div>
</main>
</body>
</html>
这是我的JS代码:
hamburger = document.querySelector(".hamburger");
hamburger.onclick = function()
{
navBar = document.querySelector(".nav-bar");
navBar.classList.toggle("active");
}
let popup = document.getElementById("popup");
function openPopup(){
popup.classList.add("open-popup");
}
function closePopup(){
popup.classList.remove("open-popup");
}
function Fach() {
var textInput = document.getElementById("fach").value;
}
我还没有尝试太多,因为我是新的html和js,但我没有找到任何解决方案在线。我的目标是改变按钮显示从'+'的主题变量。
2条答案
按热度按时间xoefb8l81#
将类添加到
<strong>
标记,然后...dbf7pr2w2#
要在JavaScript中显示html元素中的某些内容,可以使用innerHTML。
https://developer.mozilla.org/fr/docs/Web/API/Element/innerHTML