jQuery实现动态添加标签事件

【jQuery实现动态添加标签事件】jQuery实现动态添加标签事件,博智网带你了解详细信息。
本文实例为大家分享了jQuery实现动态添加标签事件的具体代码，供大家参考，具体内容如下

代码：
<body><table id="tableID" border="1" align="center" width="60%"><tr><th>用户名</th><th>密码</th><th>操作</th></tr><tbody id="tbodyID"></tbody></table><hr />用户名：<input type="text" id="usernameID" /> 密码：<input type="text" id="passwordID" /><input type="button" value="https://www.yf-zs.com/redian/增加" id="addID" /></body><script type="text/javascript">//定位"增加"按钮，同时添加单击事件$("#addID").click(function() {//获取用户名和密码的值var username = $("#usernameID").val();var password = $("#passwordID").val();//去掉二边的空格username = $.trim(username);password = $.trim(password);//如果用户名或密码没有填if (username.length == 0 || password.length == 0) {//提示用户alert("用户名或密码没有填");} else {//创建1个tr标签var $tr = $("<tr></tr>");//创建3个td标签var $td1 = $("<td>" + username + "</td>");var $td2 = $("<td>" + password + "</td>");var $td3 = $("<td></td>");//创建input标签，设置为删除按钮var $del = $("<input type='button' value='https://www.yf-zs.com/redian/删除'>");//为删除按钮动态添加单击事件$del.click(function() {//删除按钮所有的行，即$tr对象$tr.remove();});//将删除按钮添加到td3标签中$td3.append($del);//将3个td标签依次添加到tr标签中$tr.append($td1);$tr.append($td2);$tr.append($td3);//将tr标签添加到tbody标签中$("#tbodyID").append($tr);//清空用户名和密码文本框中的内容$("#usernameID").val("");$("#passwordID").val("");}});</script>
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持趣讯吧。

jQuery实现动态添加标签事件

推荐阅读

射手男想放弃你的表现

在word中如何画图在word中怎么画图

soul要咋才能加好友

志高空调出现df的原因志高空调df是什么故障

曲靖适合养什么花，市花和市树是什么

种完睫毛多久可以碰水

如何辨别浪琴机械表的真假啊

九九重阳节朋友圈问候祝福语

大熊猫是什么类别

手机银行可以绑定别人的卡吗