这篇文章主要介绍了jquery简单实现向列表动态添加新元素的方法,涉及jquery事件响应及页面元素动态操作相关实现技巧,需要的朋友可以参考下
本文实例讲述了jquery简单实现向列表动态添加新元素的方法。分享给大家供大家参考,具体如下:
先看看效果图:
完整实现代码如下:
<!doctype html><html lang="en"><head><meta charset="utf-8"><title>www.jb51.net jquery列表添加新元素</title><script src="jquery-1.7.2.min.js"></script></head><body><h3>li列表:</h3><ol> <li>jb51</li> <li>php</li> <li>javascript</li> <li>html5</li></ol><input type="text" id="text"><input type="button" id="btn" value="添加"><script type="text/javascript"> $(function () { $('#btn').click(function () { $('ol').append('<li>'+$('#text').val()+'</li>'); });});</script></body></html>
上面是我整理给大家的,希望今后会对大家有帮助。
相关文章:
在vue中有关datepicker的示例代码
如何解决网站不登录就无法复制内容的问题
vue中datepicker插件无法监听datepicker输入框的值问题
在react中有关组件间抽象详细说明
react native中navigatorios组件(详细教程说明)
有关ejsexcel模板使用方法
以上就是在jquery中如何实现向列表动态添加的详细内容。