javascript - 为什么按钮关闭不关闭窗口?
问题描述
我的菜单中有一个用于打开窗口的代码:
<li class="menu-item navigation-item menu_auth">
<a onclick="modal(859,'free-coins')" class="free-coins-link has-free-coins">
<div class="image free-coins"></div>
<div class="text">text1</div>
<div class="free-coins-active">+<span class="value">10</span></div>
</a>
</li>
和弹出块:
<div class="popup_block" id="free-coins">
<div class="free-coins-modal">
<div class="free-coins-item daily-bonus">
<div class="header">text1</div>
<div class="free-coins-sprite daily-bonus"></div>
<div class="free-coins-text">
text1
</div>
<div class="btn-yellow free-coins-btn btn-get-daily-bonus" onclick="getBonus()">text1</div>
<div class="error"></div>
</div><div class="free-coins-item referral">
<div class="header">text1</div>
<div class="free-coins-sprite referral"></div>
<div class="free-coins-text">text1</div>
<a onclick="redirect('#/referral')" class="btn-blue referral-btn free-coins-btn disabled">text1</a>
</div><div class="free-coins-item giveaway">
<div class="header">text1</div>
<div class="free-coins-sprite giveaway"></div>
<div class="free-coins-text">text1</div>
<a onclick="redirect('#/giveaway')" class="btn-blue free-coins-btn btn-get-tasks disabled">text1</a>
</div>
</div>
</div>
窗口显示,但不关闭。我在站点 js 中有一个带有关闭按钮和 JS 代码的 css 样式:
function modal(id,name) {
var popID = name;
$('#' + popID).fadeIn().css({
'width': id
}).prepend('<a onclick="modalclose" title="Close" class="close"></a>');
var popMargTop = ($('#' + popID).height() + 80) / 2;
var popMargLeft = ($('#' + popID).width() + 80) / 2;
$('#' + popID).css({
'margin-top': -popMargTop,
'margin-left': -popMargLeft
});
$('body').append('<div id="fade"></div>');
$('#fade').fadeIn();
return false;
}
function modalclose() {
$('#fade , .popup_block').fadeOut(function() {
$('#fade, a.close').remove();
});
}
但是我不能按 Esc 关闭窗口,也不能按关闭按钮关闭。我该如何解决?
解决方案
@how 添加在边界区域关闭模态 onclick 的功能:
window.onclick = function(event) {
if (event.target == modal) {
modal.style.display = "none";
}
}
推荐阅读
- maven - 未看到 WAR 模块中的 JAR 库
- c# - 关闭表单后内存没有释放
- music21 - 无法在 Music21 中显示乐谱
- java - 当我要求用户输入时,我无法从数组中删除元素
- javascript - Heroku 不允许我按照说明部署项目,但在我的情况下不起作用
- python - TFLite 转换不支持的操作:CropAndResize
- clion - 在 CLion 中导入非常大的 C 项目。(200k+ 标头)
- stm32 - 用于以太网/TCP-IP 的 STM32F3 文档
- python - 将我遇到的 Pandas 警告存储在变量中
- python - 如何修复我的定义以使用 return 语句正确结束,而不是以 print 结束?