2010-04-20 95 views
0

我正在尝试创建一个通知区域来显示警报。让div内的所有链接调用相同的函数?

return this.each(function() { 
    jQuery('<div class="' + o['className'] + '">' + o.msg + ' + 
     '<a href="#" onclick="$(this).parent().remove(); dismiss(' + o["id"] + ');">X</a>' + '</div>') 
    .appendTo(this); 
}); 

这只是从数据库中取出一条消息,并显示给用户。如果用户点击X,那么它将调用dismiss(),将其标记为正在数据库中读取。

问题是,如果消息本身包含指向另一个页面或外部网站的链接,我还想在用户离开页面之前调用dismiss()。是否有反正改变这个JavaScript采取所有a元素(X和消息中出现的任何链接),并改变onclick调用函数?

回答

1

你可以重新安排你的代码位,并使用.delegate(),像这样:(!快文档片段缓存)

return this.each(function() { 
    var id = o["id"]; 
    jQuery('<div />', { 'class': o['className'], html: o.msg }) 
    .append('<a href="#">X</a>') 
    .delegate('a','click', function() { $(this).parent().remove(); dismiss(id); }) 
    .appendTo(this); 
}); 

这使用jQuery的1.4增加了新的jQuery(html,props),使创建位清洁。它所做的不是将onclick附加到X上,而是在div中监听任意<a>的点击,当它出现泡沫时,它将执行与仅用于<a href="#">X</a>锚点相同的代码。

+0

@Brandon - 听起来就像你有一个时髦的人物,你在说'X'部分还是'o.msg'部分?最糟糕的情况是,你可以删除',text:o.msg'并在链中添加一个'.html(o.msg)'。 – 2010-04-20 01:50:50

+0

o.msg部分。我实际上给了X链接一个类来将它从消息链接中分离出来(所以我可以将它浮动到右边),现在o.msg部分可以工作。我不确定为什么。但我不相信这个工作。它生成的链接没有点击。 – Brandon 2010-04-20 01:53:19

+0

@Brandon - 你不会在html中看到'onclick',它是一个事件处理程序,在代理的函数中放置一个'alert(id)'来看它被点击。 – 2010-04-20 01:54:57

1

代码示例有点含糊,这个o从哪里来?它是全球性的还是特定于某个div的?

无论如何,您可能会发现jQuery.live()对此很有用。一旦初始化,它将被应用于与选择器匹配的所有未来新元素。你只需要有一些父元素将包含所有这些div与消息和链接。

$('#someDivId a').live('click', function() { 
    // Do your thing here as you did in `onclick` attribute. 
}; 

只是在onload时执行一次。

相关问题