jQuery | Отправить форму с пробелом

Question

Я хочу, чтобы диапазон в моей форме имел одинаковое поведение «отправить» как input type="submit".

Пожалуйста, обратите внимание, что я не могу использовать AJAX для этого в качестве третьей стороны не поддерживаю AJAX представления, следовательно, прожив до input type="submit"

Большинство поисков вернуться с использованием метода submit() однако, это не работает ?

JSFIDDLE DEMO

HTML

<form method="post" action="http://www.google.com"> 
    <input type="text" placeholder="Name"> 
    <span class="submit-span">Span submit</span> 
    <input type="submit"> 
</form> 

JQuery

$(document).ready(function(){ 
    var spanSubmit = $('.submit-span'); 

    spanSubmit.on('click', function() { 
     $(this).submit(); 
    }); 
}); 

Answer 1

Ваш $(this) в коде Jquery не относится к форме, но <span> элемент сам по себе. Таким образом, вы можете использовать DOM трансверсалъ искать/поиск родительского <form> элемента:

$(document).ready(function(){ 
    var spanSubmit = $('.submit-span'); 

    spanSubmit.on('click', function() { 
     $(this).closest('form').submit(); 
     // Will also work, but might fail if nesting is changed: 
     // $(this).parent().submit(); 
    }); 
}); 

Вот такой proof-of-concept fiddle, где я использовал предупреждение для прослушивания представить события, чтобы убедиться, что представление формы действительно называется :)

Answer 2

Почему вы не отправляете элемент формы в обработчик кликов?

$(document).ready(function(){ 
    var spanSubmit = $('.submit-span'); 

    spanSubmit.on('click', function() { 
     $(this).closest('form').submit(); 
    }); 
}); 

Answer 3

Здесь вы вызываете отправку события на пролете (который не имеет такого случая

spanSubmit.on('click', function() { 
    $(this).submit(); 
}); 

Вы должны вызвать это событие на форме:.

spanSubmit.on('click', function() { 
    $(this).closest('form').submit(); 
}); 

Answer 4

Вы должны запустить родной JavaScript submit событие на элементе form:

$(document).ready(function(){ 
    var spanSubmit = $('.submit-span'); 

    spanSubmit.on('click', function() { 
     $(this).closest('form')[0].submit(); 
    }); 
});