动态添加元素时触发javascript/jQuery

在通过js/jQuery动态加载的元素上执行某些操作的最简洁方法是什么？基本上，用户添加一个可能有一个wysiwyg编辑器的表单（取决于上下文）;这是一个textarea，需要调用$(".wysiwygTA").editor();之类的东西。当然，我可以这样做：动态添加元素时触发javascript/jQuery

var newForm = 'some_form_loaded_via_ajax_with_a <textarea class="wysiwygTA"> in_it'; 
$(".formWrapper").append(newForm); 
$(newForm).find(".wysiwygTA").each(function(){ $(this}.editor(); });

但是，这似乎对我来说很干净。理想情况下，我想以

$(document).listenForAddedTextarea(function(textarea){textarea.edtior();});

这样的方式做点什么，以便我可以从多个位置添加表单。我可能孤立在一个单独的函数编辑器调用，只是调用，但仍然留给我一个额外的代码行，每次我想添加一个元素。

因此：什么是最好的方法呢？：O）

最好的问候，

拉斯穆斯登克尔

来源

2014-09-29 Dencker

使用on（）动态绑定。 – SuperBear 2014-09-29 08:21:19

@SuperBear - 我将绑定到什么？我尝试过（'[加载并准备好]'，'.wysiwygTA'，...），但都不起作用。 – Dencker 2014-09-29 08:23:07

到目前为止，我发现最简洁的方式是包含（function（）{$（“。wysiwygTA”）。editor（）;}）（）;在通过ajax加载的HTML中。 – Dencker 2014-09-29 08:24:02

有在JS elementAdded事件没有这样的事情。你唯一的选择是你提到的第一个选项。在HTML中添加脚本是从服务器返回是一个坏主意IMO。

来源

2014-09-29 08:26:19 Dmitry

我认为这个答案就足够了。谢谢。 – Dencker 2014-09-29 08:48:30

使用绑定来动态绑定：

$(document).bind("listenForAddedTextarea", function(textarea) { 
textarea.edtior(); 
});

来源

2014-09-29 08:21:10 Hansraj

谢谢你的答案，但listenForAddedTextarea实际上是从来没有触发过，它只是一种伪造别名，用于说明我正在努力实现的目标。 – Dencker 2014-09-29 08:22:07

你可以做一件事。创建一个事件并随时触发该事件。

创建 'listenForAddedTextarea' 事件等

$(document).on("listenForAddedTextarea", function(textarea) { 
textarea.edtior(); 
});

触发事件

（文档）$ .trigger（ “listenForAddedTextarea”）;

来源

2014-09-29 08:27:09

创建和触发不存在的事件的要点是什么？他需要调用'$（document）.trigger（“listenForAddedTextarea”）;'当他从服务器加载HTML时。他可以调用添加编辑器的函数。 – Dmitry 2014-09-29 08:30:43

我刚刚将这行代替$（newForm）.find（“。wysiwygTA”）。each（function（）{$（this）.editor（）;}）;从这一行$（document）.trigger（“listenForAddedTextarea” ）; – 2014-09-29 08:35:26

回答

相关问题