代码举例:jquery

更多按钮:ajax

json

点击按钮添加一行文本框和“提交”按钮:(没有问题,能够正常添加)服务器

$(".addMore").click(function(){app

var index = this.id.substring(7,this.id.length);post

//$("#tr"+index).clone().appendTo("#table"+index);this

$("#table"+index).append("

"+url

"

"+spa

"

"+事件

"

"+

"

");

});

全部“提交”按钮的点击事件:

$(".submitBtn").click(function(){//初始化后添加的jQuery元素的click事件

//议题的编号,也是text的index

var index = this.id.substring(6,this.id.length);

alert("index="+index);

var content = $("#content"+index).val();

var date = $("#date"+index).val();

var result = $("#result"+index).val();

//判断是否有空值

if(content.length != 0 && date.length != 0 && result.length != 0 ){

$.ajax({

url:"addIssueInfo",

type:"post",

data: {issueContent:content,

issueId:index,

issueDate:date,

issueResult:result},

datatype: "json",

success:function(){

alert("添加成功!");

$tr = $("#addBtn"+index).parent("td").parent("tr");

$tr.remove();

//追加行

$("#table"+index).append("

"+content+""+date+""+result+"");

},error:function(){

alert("服务器忙,请稍候再试!");

}

});

}else{

alert("对不起,当前行的每一条信息均不能为空,请补全后提交!");

}

});

问题是,为何点击“更多”触发的事件添加的文本框和“提交”按钮,这个按钮不执行class="submitBtn"的点击事件?

解决:在添加更多一行的时候所产生的 input 和 button 都是动态生成的,因此不能使用 click,要使用 live (jquery 1.7.2 以后的版本不建议使用 live) 或 on

把$(".submitBtn").click(function(){

改成

$(".submitBtn").live('click', function(){

或者

$(".submitBtn").on('click', function(){

记住若是元素在页面初始化的时候不存在,而是以后经过动态生成在页面中的,要对这些元素进行操做,例如 click, blur, keyup, change....,都要使用 on

.on('click', function

.on('blur', function

.on('keyup', function

....

html按钮绑定点击事件无效,jquery添加的html元素按钮为何不执行类样式绑定的click事件...相关推荐

  1. jquery添加的html元素按钮为什么不执行类样式绑定的click事件

    代码举例: 更多按钮: <input type="button" class="addMore" id="addMore${issue.id } ...

  2. jq添加或删除html元素,jQuery添加删除DOM元素方法详解

    本文实例分析了jQuery添加删除DOM元素的方法.分享给大家供大家参考,具体如下: 介绍 DOM是Document Object Modeule的缩写,一般来说,DOM操作分成3个方面. 1.DOM ...

  3. JavaScript 学习-37.jQuery 添加/删除/替换元素

    前言 通过 jQuery,可以很容易地添加和删除元素. 添加元素 添加元素主要用到四个方法 append() - 在被选元素的结尾插入内容 prepend() - 在被选元素的开头插入内容 after ...

  4. C# webBrowser 自动登录淘宝 模拟点击输入 模拟点击无ID 无name的html元素按钮

    (淘宝已经限制第一次登录需要输入验证码了,在ie下登录一次,再运行代码,无法实现了,下面只是一个例子) private void Form1_Load(object sender, EventArgs ...

  5. jQuery添加、删除元素

    jQuery添加元素: prepend()在头部添加,添加的内容在被选标签的内部 append()在尾部添加,添加的内容在被选标签的内部 before()在头部天际,添加的内容在被选标签的外部 aft ...

  6. uniapp 真机调试 click点击事件无效

    问题分析: (网络上普遍答案,但不能确定是否是这个原因导致) 移动端的主要问题是click会有200-300ms的延迟,主要原因是苹果手机在设计时,考虑到用户在浏览网页时需要放大,所以,在用户点击的3 ...

  7. js禁止点击按钮(点击无效)

    1.设置按钮不可点击 document.getElementById("bt1").disabled=true; 2.设置按钮可点击 document.getElementById ...

  8. 使用AlertDialog自定义布局,解决自定义控件的监听事件无效的办法

    使用AlertDialog自定义布局,解决自定义控件的监听事件无效的办法 在很多情况下,Android自带对话框的样式满足不了我们项目的需求,这时候我们可以采用为对话框设置自定义布局.如果直接用Dia ...

  9. angular条件渲染、列表渲染、属性绑定、样式绑定、事件绑定

    文章目录 属性绑定 样式绑定 绑定单一样式 绑定多个样式 用 NgStyle 设置内联样式 类绑定 绑定单个类样式 绑定到多个 CSS 类 用 NgClass 添加和删除类 条件渲染 列表渲染 *ng ...

最新文章

  1. Linux下中文man帮助安装。
  2. 【5.2】事务的隔离级别
  3. 代码逻辑分析_双11模块79.34%的前端代码是怎样智能生成的?
  4. LYNC文件传输功能开关
  5. 爬虫python名词解释_python爬虫
  6. 华为软件机试测试题C语言,华为软件测试面试经验
  7. 二级联动菜单(转载)
  8. 《数学之美》—自然语言处理
  9. VC++调用大漠插件
  10. oracle 判断是否复数,第 14 章 使用复数运算库
  11. 凭借这份diao炸天的资料,狂刷三遍成功从外包进入了字节跳动!
  12. 我们整理了20个Python项目,送给正在求职的你
  13. linux下java程序乱码,解决linux下java程序(例如applet)中文乱码问题
  14. linux虚拟机之ubuntu的软件包管理(6/10)
  15. 报错:启动apache服务时出现报错
  16. Elasticsearch启动报错:warning: ignoring JAVA_HOME=C:\Program Files\Java\jdk1.8.0_191; using bundled JDK
  17. 电脑开机时网络连接一直转圈,出现红叉
  18. 2020美亚杯个人赛
  19. JMeter—录制脚本
  20. 我人生的两大梦想是: 睡觉睡到自然醒 数钱数到手抽筋

热门文章

  1. 从硬盘安装在XP下装红旗linux双系统
  2. Google Maps API 初级2
  3. 乐佰小迪智能机器人怎么使用_425台云洲智能水面救生机器人在山东寿光投入使用...
  4. 【kubernetes系列】Pod篇实战操作
  5. 在CentOS中安装NodeJS
  6. aspectj 注解
  7. 微软将结束对Windows Vista系统的扩展支持
  8. 循序渐进Python3(十二) --2--  web框架之django简单实现oracle数据库操作
  9. 源码编译安装gcc-5.3.0
  10. Centos 6安装完美搭建mysql、php、apache之旅