让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调用函数？

答

你可以重新安排你的代码位，并使用.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>锚点相同的代码。

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

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

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

答

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

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

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

只是在onload时执行一次。

让div内的所有链接调用相同的函数？

相关推荐