1

フォームを作成するためのコードが数行あり、コードの後半で$.postJSONを介してAJAXを使用しています。

私のhtmlフォームスクリプトコードは単純なフォームを作成し、「enviar（送信）」ボタンを押すと、varsデータが出力$.postされます。このメッセージの後半で説明するように、dados.phpというファイルで呼び出しています。

preventDefault()「enviar」ボタンをクリックしてjQueryを使用しても何も起こらないという印象を受けていますが、varsからのデータを表示する他のページが表示されます（ dados.php内で実行print_r($_POST);しています。var_dump($_POST);

まず、jQuerypreventDefault()または他のユーザー（私のコードにコメントが表示されます）が、ユーザー/私が「enviar」（送信）ボタンをクリックした後のアクションを「防止」するというのは間違っている可能性があります。何も起こりませんが、それでも私の変数データを出力します。

第二に/最後に、私のコードに何か問題があります。

次のスクリプトコードで、HTMLフォームとdados.php（phpコード）を確認してください。事前に私は本当にあなたの助けに感謝します：

私のHTMLフォーム/JSON：

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
        <title></title>
    </head>
    <body>

    <div id="result">texto do cliente</div>​

    <form id ="myform"action="dados.php" method="post">

        <table>
            <tr>
                <td>Nome:</td>            
                <td>
                    <input type="text" id="first_name" value="" maxlength="25" />
                </td>            
            </tr>

            <tr>
                <td>Sexo:</td>
                <td>
                    <input type="radio" id="Sexo" value="Masculino" /> Masculino
                    <input type="radio" id="Sexo" value="Feminino" /> Feminino
                </td>
                </tr>

                <tr><td>Profissão:</td>
                <td>
                    <select id="dropdown">
                    <option value ="administrador">Administrador</option>
                    <option value ="analista">Analista</option>
                    <option value ="designer">Designer</option>
                    <option value ="gerente">Gerente</option>
                    </select>
                </td>
                </tr>

                <tr>
                <td>
                    <input id="submit" type="submit" value="enviar"/>                    
                </td>
                </tr>
        </table>  

        <script type="text/javascript">
            $(function(){
                /* attach a submit handler to the form */
                $("input[type='submit']").click(function(e) {

                /* stop form from submitting normally */
                   e.preventDefault(); 
                   //e.stopImmediatePropagation();
                   //e.stopPropagation();

            $.post(   
                'dados.php', {firstname: $('#first_name').val(), sexo: $('#sexo').val(),
                             profissão: $('#dropdown').val()}, function(data) {  
                console.log(data);
                //$('#result').html(data)
                //$('#result').html(data.firstname)
                //$('#result').html(data.sexo)
                //$('#result').html(data.profissão)
                }, 'json');
            });           

         </script>        

        <script>

        </script>

    </body>
</html>

私のDADOS.PHP：

//ECHO $_POST['dropdown'];

print_r($_POST);

var_dump($_POST);

本当にありがとう。

マルコ・ランザ

4

8 に答える 8

5

を閉じていません$(function(){。

最後にもう 1 つ追加する必要があります});。

于 2012-04-19T20:57:35.947 に答える
0

return false;コールバックの最後に追加してみてください。AJAXフォームを作成する場合は、通常、フォーム自体にこれを設定します。<form action="someAction" method="post" onsubmit="return false;">

また、ボタンのイベントではなく、のsubmitイベントにアタッチする必要があります。ユーザーがEnterキーを押すと、ボタンのイベントハンドラーをバイパスして、フォームが送信されることに注意してください。formclick

于 2012-04-19T20:51:50.783 に答える
0

それ以外の：

$("input[type='submit']").click(function(e) {

これを試して：

$("#myform").submit(function(e) {
于 2012-04-19T20:52:11.410 に答える
0

jQueryスクリプトをHTMLヘッダーに入れて、に変更しようとしまし$(function()た$(document).ready(function(){か？

于 2012-04-19T20:52:42.703 に答える
0

$("input[type='submit']").click(function(e) {は送信ハンドラーではなく、送信ボタンのクリックハンドラーです。これは、実際に必要なものではない可能性があります。

その行を$("form#myform").submit(function(e) {代わりに置き換えてみてください。

于 2012-04-19T20:52:46.143 に答える
0

return false を入れてみてください。$.post 呼び出しの後

于 2012-04-19T22:15:10.110 に答える
0

これがあるフォーム送信に変更します。

$("input[type='submit']").click(function(e) {

これを行う：

$('#myform').submit(function(e) {
于 2012-04-19T20:53:13.370 に答える
0

本当に、<input type="button">クリックハンドラーを使用してそれに追加するだけです。

于 2012-04-19T20:53:55.103 に答える