Я использую .submit() для обнаружения, когда форма отправляется, но вместо выполнения ее присоединенной функции она обновляет страницу.
Я создаю инструмент для построения диаграмм древовидных структур (с использованием вложенных списков) в http://chris-armstrong.com/familytree.
Чтобы добавить потомка, вы включаете элементы управления и добавляет <li class="add_member">+</li>
к каждому <ul>
(или генерации).
Когда вы нажимаете на элемент <li class="add_member">+</li>
, он заменяет +
на <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("+");
}
});
});
}
EDIT: добавление return false; останавливает обновление страницы, но функция, связанная с .submit(), кажется, не срабатывает, любые идеи почему?