2

フォームタグの内容は次のとおりです。-

<form method="post" action="<?php echo $_SERVER['PHP_SELF'] ;?>" >

ボタンタグの内容は：-

<input type="submit" id="submit_button" value="Submit">

j-query関数は

$('#submit_button').click(function ()
            {        
                alert("button clicked");
                buildingVal = $("#building").val();
                levelVal = $("#level").val();
                data = 'building=' + buildingVal.val() + 'level=' + levelVal.val();
                $.ajax(
                {

                    url: "res.php", 
                    type: "POST",
                    data: data,     
                    success: function (data) {
                    }
                });
                return false;
            });

ページが再読み込みされ、テキストボックスとドロップダウンメニューのデータが消えます。

しかし、jqueryにこのコードしかない場合：-

$('#submit_button').click(function ()
            {        
                alert("button clicked");
 return false;
            });

その後、ページはリロードされず、値はそのまま残ります。

ページがリロードされないようにするにはどうすればよいですか？

また、ajax呼び出しでは、テーブルを返すページres.phpを呼び出します。

コードは何になりますか

success: function (data) {
                    }

助けてください...

編集：

コードを使用してデータをres.phpページに渡します

data = 'building=' + buildingVal.val() + 'level=' + levelVal.val();

次に、を使用してページに渡します

$.ajax(
                {

                    url: "res.php", 
                    type: "POST",
                    data: data,     
                    success: function (data) {
                        $('#npc').html(data);
                    }
                });

res.phpページで

渡された単一の値から2つの値を抽出するにはどうすればよいですか

私は次のコードを使用してみました

$building = mysql_real_escape_string($_GET['building']);
$level = mysql_real_escape_string($_GET['level']);

しかし、それは機能しません...

4

4 に答える 4

3

jQueryコードにエラーがあります：

エラー：

buildingVal = $("#building").val();
levelVal = $("#level").val();
data = 'building=' + buildingVal.val() + 'level=' + levelVal.val();

解決：

buildingVal = $("#building");
levelVal = $("#level");
data = 'building=' + buildingVal.val() + '&level=' + levelVal.val();

完全なコードjs：

$('#submit_button').click(function () {        

   var 
       buildingVal = $("#building"),
       levelVal = $("#level"),
       data = 'building=' + buildingVal.val() + '&level=' + levelVal.val();


   $.ajax({
      'url': 'res.php', 
      'type': 'POST',
      'data': data,     
      'success': function (data) {
      }
   });

   return false;

});

編集

このフォームを使用してajaxでデータを送信する場合は、フォームを「送信」するイベントをキャンセルするのが最善の方法です。

HTML：

<form id="myform" method="post" action="<?php echo $_SERVER['PHP_SELF'] ;?>" >
...
</form>

JS：

$('#myform').bind('submit', function(event) {

     return false;
});

$('#submit_button').bind('click', function () {        

   var 
       buildingVal = $("#building"),
       levelVal = $("#level"),
       data = 'building=' + buildingVal.val() + 'level=' + levelVal.val();


   $.ajax({
      'url': 'res.php', 
      'type': 'POST',
      'data': data,     
      'success': function (data) {
      }
   });

});
于 2012-08-31T11:48:27.743 に答える
2

submitそもそもボタンを使わないのが一番です。

<input type="button" id="myButton" value="Submit">


$('#myButton').on('click', function(){
   //do ajax
});
于 2012-08-31T11:42:52.807 に答える
0

クリックイベントのデフォルトの動作を防ぐ必要があります。

$('#submit_button').click(function (event)
{
    event.preventDefault();
    alert("button clicked");
    return false; // Not truly necerssary
});

http://api.jquery.com/event.preventDefault/

于 2012-08-31T11:43:25.703 に答える
0

したがって、送信ボタンがデフォルトの動作でページを送信しないようにするには、次のようにします。

$('#submit_button').click(function (event) {        
                event.preventDefault();
                buildingVal = $("#building").val();
                levelVal = $("#level").val();
                data = 'building=' + buildingVal.val() + 'level=' + levelVal.val();
                $.ajax(
                {

                    url: "res.php", 
                    type: "POST",
                    data: data,     
                    success: function (data) {
                    }
                });                
});
于 2012-08-31T11:45:09.837 に答える