我来维持一段JavaScript从服务器下载一些JSON数据,建立一个新的表行(如$('<tr></tr')
并将其插入到文档中。
的a
节点,在这样创建一个点:
var a = $('<a class="foo" href="#"></a>');
后来,事件势必会像这样:
a.click(function () {
// yadda yadda
return false;
});
唯一的问题是,这似乎并没有工作。 也不对通过结合on()
或已过时的live()
该处理程序简单的“忽略”,从来没有火灾和页面滚动到顶部(由于href="#"
)。 当绑定的情况下,该元素已经append
编到DOM。 任何帮助将不胜感激。
我想到的一些背景信息:该元素是一个循环遍历数据中创建的,但除非JavaScript有一些非常奇怪的东西与作用域回事,再加上一切我尝试用元素的作用不应该是一个问题:我可以改变它的内容,样式,只是事件绑定不起作用。 当然,jQuery的版本,这是1.8.3。
EDITED
的。对()应当建立这样与动态创建的元素来工作。 此外,确保使用jQuery 1.8版(最新版)
此外,还需要防止点击的标准动作,如果你不想滚动到顶部。
这是一个工作FIDDLE
var a = $('<a class="foo" href="#">ASD</a>');
a.appendTo($("body"));
$('body').on('click', 'a', function(e) {
e.preventDefault();
$(this).after('<br/><a class="foo" href="#">ASD</a>');
});
You have various options. You can bind to the element or to the document.
绑定到文档:
$(document).on("click", "a.foo", function(event){
//do stuff here
});
当您绑定到一个文件,你可以自由创建和销毁a.foo元素,它们都将在您的响应函数。
绑定到元:
$("a.foo").on("click", function(event){
//do stuff here
});
当您绑定到一个元件,其功能势必ONLY以前存在的所有元素。 所以一定要在文件加载结束或者在你的函数结束做到这一点。
我建议总是结合文件!
有两件事情,我想起:
- 链接没有文字,所以你没有点击它。
- 你甚至不追加到DOM。
这里存在与代码非常相似,你的工作的小提琴。
var a = $('<a class="foo" href="#">ASD</a>');
a.click(function() {
alert('a');
});
a.appendTo($("body"));
您可以使用事件委托像这样。
$('body').on('click','.foo',function(){
alert('foo');
});
这将允许您设置事件处理程序之前的元素存在。
试试这个:
var a = $('<a class="foo" href="#">ASD</a>');
$("body").html(a);
a.click(function() {
alert('a');
return false;
});
尝试在您创建动态元素的功能范围内绑定功能。
$('a.foo').on('click',function(event){
//your code goes here
});