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

2018-10-24 15:07:01 +08:00
 a194259440

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

4048 次点击
所在节点    C#
7 条回复
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)

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/500668

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX