我在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()的函数似乎没有被关闭,任何想法为什么？