我正在尝试使用 JavaScript 显示一个弹出窗口,但是,带有 class="popup" 的 div 是当前显示的唯一内容。当用户执行一个动作时,popup 和 popup2 都应该显示。我不确定我做错了什么。HTML:<div class="popup"> <span class="popuptext" id="popup"></span></div><div class="popup2"> <div class="popup2text" id="popup2"></div> <script src="/popup2.js"></script></div>JavaScript:$(() => { $('#enter').on('keypress', function(e) { if (e.keyCode == 13) { const newTask = $(this).val(); if (newTask) {上面的javascript部分可以忽略 var popup = document.getElementById("popup"); popup.classList.toggle("show"); var popup2 = document.getElementById("popup2"); popup2.classList.toggle("show"); } } });});CSS:.popup { position: relative; display: inline-block; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}.popuptext { visibility: hidden; width: 160px; height: 200px; background-color: #131313; color: #fff; opacity: 0.95; text-align: center; border-radius: 6px; padding: 8px 0; position: absolute; z-index: 1; left: 581px; top: 180px; margin-left: -80px;}.popup .show { visibility: visible; -webkit-animation: fadeIn 0.5s; animation: fadeIn 0.5s;}@-webkit-keyframes fadeIn { from {opacity: 0;} to {opacity: 1;}}@keyframes fadeIn { from {opacity: 0;} to {opacity:1 ;}}#popup2 { visibility: hidden; color: white; font-family: 'Quicksand', sans-serif; font-size: 50px; top: 50px; left: 50px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}#popup2 .show { visibility: visible; -webkit-animation: fadeIn 0.5s; animation: fadeIn 0.5s;}
2 回答
翻过高山走不出你
TA贡献1875条经验 获得超3个赞
您的 HTML 代码无效。
改变这个
<div class="popup">
<span class="popuptext" id="popup"></span>
</div>
<div class="popup2"></div>
<div class="popup2text" id="popup2"></div>
<script src="/popup2.js"></script>
</div>
对此
<div class="popup">
<span class="popuptext" id="popup"></span>
</div>
<div class="popup2">
<div class="popup2text" id="popup2"></div>
<script src="/popup2.js"></script>
</div>
添加回答
举报
0/150
提交
取消