我使用.submit()检测表单何时提交,而不是执行其附加的功能,它刷新页面.
我在http://chris-armstrong.com/familytree建立一个绘制家谱图(使用嵌套列表)的工具.
要添加后代,您可以打开控件,并添加< li class =“add_member”> < /锂>每个< ul> (或一代).
当您点击< li class =“add_member”> < /锂>元素,它替换了< form class =“add_member>由< input>和< submit>按钮组成,然后使用$(”form.add_member“).submit()来检测何时提交按钮被点击,然后它应该用< input>的内容替换表单,但是在这一点上它只是刷新页面(并在URL中添加一个).
任何想法我做错了什么?我已经把下面的整个功能.
function addAddListeners() { $('li.add_member').click(function(){ //create input form $(this).html("<form class='add_member'><input id='fn_' placeholder='Name' required autofocus /><button type='submit'>Add</button></form>") //listen for input form submission $("form.add_member").submit(function(){ //if input form isn't blank,create new li element with content of form,else go back to the add_member li if($('form.add_member').val()) { $(this).replaceWith('<li><span class="vcard" title="Click to edit this members details"><span class="edit fn">'+$('input#fn_').val()+'</span></span><ul><li class="add_member">+</li></ul></li><li class="add_member">+</li>'); addEditListeners(); addAddListeners(); } else { alert("no change"); $(this).html("+"); } }); }); }
编辑:添加返回false;停止页面刷新,但是附加到.submit()的函数似乎没有被关闭,任何想法为什么?
解决方法
>你需要返回false;或
>您应该使用委托来查看jQuery
event.preventDefault();
从提交功能,以防止默认表单操作发生.
>您应该使用委托来查看jQuery
on
,因此当将新元素添加到DOM时,不必重新绑定事件.
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。