Получение формы html и ее значений

Question

Рассмотрите этот html:

<form onsubmit="alert( $(this).html() );return false">
    <input type='text' name='test'/>
    <input type='submit' value='Submit'/>
</form>

Если я наберу какой-нибудь текст в поле ввода, значение не будет записано в html ().Как получить необработанный HTML-код и его входные значения?

Answer 1

Атрибуты value и т. Д. Не синхронизируются с элементами формы. Вы могли бы использовать такой код, хотя предполагая, что ваша форма содержит только те входные данные, которые имеют правильный value (например, нет элементов select, checkbox и radio)

$('form').submit(function(e) {
    e.preventDefault();
    $(':input', this).each(function() {
        var $this = $(this);
        $this.attr('value', $this.val());
    });
    alert($(this).html());
});

Не забудьте удалить код onsubmit из HTML. Если у вас более одной формы, замените $('form') на $('#someid') и добавьте id="someid" в тег формы.

Answer 2

используя Jquery, вы можете сделать так:

<form id='form'>
    <input type='text' name='test' id='name'/>
    <input type='submit' value='Submit'/>
</form>

и код jquery

$(document).ready(function(){
    $('#form').submit(function(){
        alert($(this).find("#name").val());
        return false;
    });
});

Пример кода Fiddle