如何对由 JS 代码动态生成的控件进行事件的绑定

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

› Visual Studio

› MonoDevelop

这是一个创建于 2205 天前的主题，其中的信息可能已经有所发展或是发生改变。

已知将代码重构为方法，然后使用 bind 进行绑定，但是老平台设计太多 JS 了，不可能每一个事件都去重构，还有其他的方法吗？

重构

绑定

代码

bind

7 条回复 • 2018-10-24 18:29:09 +08:00

bsg1992

2018-10-24 16:46:49 +08:00

还是在用 webfrom 嘛

murolq

2018-10-24 16:59:16 +08:00

方法 1.
```js
var $ele = $('<button id='upload' />');
$('#form').append($ele);
$ele.on('click', doSomething);
```

方法 2
```js
// file1.js
$('#form').on('click', '#upload', doSomething)

// file2.js
var $ele = $('<button id='upload' />');
$('#form').append($ele);
```

a194259440

2018-10-24 18:10:00 +08:00

@bsg1992 呃，不是，难道 MVC 不能用吗？

@murolq 思路是一样的，这样的话还是要去每个 JS 改，主要是，程序加载时已经绑定了事件

a194259440

2018-10-24 18:17:13 +08:00

假如有 1 个按钮
<button id="btn1" class="btns">按钮</button>
在 ready 时，有 10 个不同的 JS 对他进行了绑定事件：代码如下
click.js
$(".btns").click(function(){
....
});
hover.js
$(".btns").hover(function(){
....
});
blur.js
$(".btns").blur(function(){
....
});
...
然后我根据需求，用 ajax 请求的数据，动态生成一个一样的按钮
<button id="btn2" class="btns">按钮</button>
除了类似于这样的：
$(".btns").bind("click",bindclick);
function bindclick(){
....
}
还有什么其他的方法吗？能不能获取到 id=btn1 的所有绑定事件，然后赋给 btn2?

TomatoYuyuko

2018-10-24 18:26:07 +08:00

试试 jquery 的 clone()

Pastsong

2018-10-24 18:28:14 +08:00

event delegate

TomatoYuyuko

2018-10-24 18:29:09 +08:00

var $newBtn = $(".btns").clone(true)