无法关闭 JS 弹窗答案

【问题标题】：can not close JS popup无法关闭 JS 弹窗
【发布时间】：2012-10-02 22:13:16
【问题描述】：

我有一个脚本，它创建一个延迟 3000 的弹出窗口并出现在我的网站中，问题是我无法删除它，这是我的脚本

html

 <div id="growl"></div>

css

#growl {
position: absolute;
padding:5px;
bottom: 0;
right: 5px;
width: 320px;
z-index: 10;
}

.notice {
 position: relative;
 min-height: 30px;
 padding:5px;
 }

 .skin {
 position: absolute;
 background-color: #000000;
 bottom: 0;
 left: 0;
 opacity: 0.6;
 right: 0;
 top: 0;
 z-index: -1;
 -moz-border-radius: 5px; -webkit-border-radius: 5px;
 }

关闭按钮

 .close {
 background: transparent url('../img/egrowl.png') 0 0 no-repeat;
 text-indent: -9999px;
 position: absolute;
 top: 2px;
 right: 2px;
  width: 26px;
 height: 26px;
 }

我的脚本

 $(document).ready(function(){

延迟

setTimeout(function() {

addNotice('<p>Do not Forget To Become A member </p><a href="subscribe.php">Subscribe</a>');

},3000);

关闭功能

$('#growl')
.find('.close')
.on('click', function() {
    $(this)
        .closest('.notice')
        .animate({
            border: 'none',
            height: 0,
            marginBottom: 0,
            marginTop: '-6px',
            opacity: 0,
            paddingBottom: 0,
            paddingTop: 0,
            queue: false
        }, 2000, function() {
            $(this).remove();
        });
   });
      });

设置

 function addNotice(notice) {
$('<div class="notice"></div>')
    .append('<div class="skin"></div>')
    .append('<a href="#" class="close">close</a>')
    .append($('<div class="content"></div>').html(notice))
    .hide()
    .appendTo('#growl')
    .fadeIn(1000);
 }

【问题讨论】：

标签： javascript css popup

【解决方案1】：

点击函数回调中的 this 不再引用调用对象，因此您需要将调用对象的 this 上下文绑定到该函数，或者将 this 更改为要关闭的元素的 id。

【讨论】：

【解决方案2】：

您的设置中有更多错误。我创建了这个小提琴： http://jsfiddle.net/CyJRF/2/

您正在将单击事件绑定到“.close”元素，但您是在 $(document).ready() 处执行此操作，然后在“addNotice”中创建该元素之前。我已经移动了一些 javascript...

正如@Jordan 正确指出的那样，您需要更改 $(this)。我现在只使用$("#growl .notice")

【讨论】：

非常感谢，这很好，它在 JSFIDDLE 上运行良好，但是当我把它放在我的 html 中时，我在最后出现了这个错误 Unexpected token ILLEGAL。
查看此帖子：stackoverflow.com/questions/4404526/… 或只是 Google 'Unexpected token ILLEGAL' ;)
对不起，谢谢，一切正常，非常感谢。