JQuery сериализовать форму при нажатии кнопки

У меня есть простая форма, которую я хочу отправить JQuery. Мой следующий код почти работает, но ведет себя смешно. У меня есть две кнопки, submit (сериализация) и отмена (ничего не делать). оба указывают на одну и ту же функцию javascript, но при нажатии кнопки отправки появляется окно с предупреждением. При новой загрузке страницы нажав кнопку «Отправить» ничего не будет, но если вы нажмете ее еще раз, она покажет окно предупреждения, но дважды. Если вы снова нажмете его, он появится 3 раза и т. Д. И т. Д. Кнопка отмены, если она нажата, ничего не делает, однако она также добавляет количество раз, когда окно оповещения появляется в следующий раз, когда вы нажимаете кнопку submit. Я посмотрел на много примеров, и, насколько я могу сказать, что я делаю это правильноJQuery сериализовать форму при нажатии кнопки

HTML:

<head> 
    <script src="js/jquery.min.js"></script> 
    <script src="js/ajax.js"></script> 
</head> 

<body> 
    <form id="test" action=""> 
    First name: <input type="text" name="FirstName" value="Mickey" /><br> 
    Last name: <input type="text" name="LastName" value="Mouse" /><br> 
    </form> 

    <button id="tbutton" onclick="test()">Serialize</button> 
    <button id="fbutton" onclick="test()">do nothing</button> 

</body>

Моя функция:

function test() { 
    $("#tbutton").click(function(){ 
    alert($('#test').serialize()); 
    }); 
}

Я хотел бы получить форму info в функцию AJAX, поскольку она используется в другом месте моего проекта, и данные формы не всегда используются.

function get_node_data(u_id) { 
var xmlhttp; 
var ser_new_area = ""; 

    $("#move").click(function(){ 
     alert($('#move_node').serialize()); 
     var ser_new_area = $('#move_node').serialize(); 
    }); 

if (window.XMLHttpRequest) { 
    xmlhttp = new XMLHttpRequest(); 
} else { 
    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
} 
xmlhttp.onreadystatechange = function() { 
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
     document.getElementById("data_main").innerHTML = xmlhttp.responseText; 
    } 
} 

xmlhttp.open("POST", "AJAX_node_overview.php", true); 
xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
xmlhttp.send("u_id=" + u_id + "&" + ser_new_area); 
}

источник

2014-01-24 Tyler

У нас не было вашего кода ajax.js. Можете ли вы разместить свой код в [JSFIDDLE] (http://jsfiddle.net/)? Легче найти проблему. –

Почему у вас есть две привязки к одной и той же кнопке? Вы должны удалить атрибут onclick и использовать привязку $ (selector) .click() – mart

Каждый раз, когда вы вызываете свой функциональный тест(), вы привязываете новое событие click к своей кнопке. Вы должны привязать событие только к загрузке страницы. –

С @ Mart, и другие помогают я пришел с этим:

кнопку Bind:

$(document).ready(function(){ 
    $("#tbutton").click(function(){ 
    test($('#test').serialize()); 
    }); 
});

функция:

function test(data) { 
    alert(data); 
}

Спасибо.

источник

2014-01-24 20:42:23 Tyler

HTML:

<body> 
    <form id="test" action=""> 
    First name: <input type="text" name="FirstName" value="Mickey" /><br> 
    Last name: <input type="text" name="LastName" value="Mouse" /><br> 
    </form> 

    <button id="tbutton">Serialize</button> 
    <button id="fbutton">do nothing</button> 

</body>

JAVASCRIPT:

$(function() { 
    $("#tbutton").click(function(){ 
     alert($('#test').serialize()); 
    }); 
});

источник

2014-01-24 20:07:20

Проблема с кода вы вызываете функцию тестирования при нажатии на кнопку Serialize и в этой функции вы привязываетесь нажатие кнопки на функцию.

Попробуйте изменить это:

$(document).ready(
    $("#tbutton").click(function(){ 
     alert($('#test').serialize()); 
    }); 
)

И в вашем HTML:

<button id="tbutton">Serialize</button> 
<button id="fbutton">do nothing</button>

источник

2014-01-24 20:09:53 mart

Мне нужно сделать это внутри функции, так как нажатие отмены вернется к предыдущей странице. Я отредактирую свой пост. – Tyler

Спасибо, это помогло мне много. Мне нужно связать щелчок на загрузке страницы, а затем вызвать функцию из этого – Tyler

Yup, и вам будет приятно :) – mart

JQuery сериализовать форму при нажатии кнопки

ответ

Смежные вопросы