0

私が達成したいことを詳細に説明しましょう。index.html、form.html、result.php の 3 つのページがあります。index.html のボタンをクリックしたときに jquery を使用すると、index.html の div 内に form.html がロードされます。送信時の form.html は、result.php を呼び出します。私が達成したいのは、form.html（index.htmlにロードされた）の送信ボタンをクリックすると、result.phpの結果が、form.htmlをロードしたindex.htmlのdivに表示されることです。以下は、3 ページすべてのコードです。どんな助けでも素晴らしいでしょう。

index.html の内容:

<html>
   <head>
       <title>index.html</title>
       <script type="text/javascript" src="/scripts/jquery-1.8.2.min.js"></script>
   </head>
   <body>
   <script type="text/javascript">
   $(document).ready(function () {
   var theme = getTheme();
   $("#loadformbutton").jqxButton({ width: '120', height: '30', theme: theme });
   $("#loadformbutton").bind('click',function()
   {
        $('#div_for_form').load('form.html', function() {});
   });
   });
   </script>
   <div id="buttons">
      <input type="button" value="loadform" id='loadformbutton' />
   </div>
   <div id="div_for_form">
      Here loads form.html
   </div>
   </body>
</html>

form.html の内容:

<html>
   <head>
      <title>form.html</title>
   </head>
   <body>
      <form method="POST" action="result.php">
         <input type="password" name="pass" id="pass"/>
         <input type="submit" value="Ok" id="changepass"/>
      </form>
   </body>
</html>

result.php の内容:

<?php
   $received=$_POST['pass'];
   echo 'Received: '.$received;
?>

現時点では機能していますが、result.php の結果が新しいページに表示されます。

4

6 に答える 6

1 
$('#changepass').click(function(){
var id = $('input#pass').val();
$.post( 'http://domain.com/result.php' { id : id },
        function(response){
            $('div#div_for_form').html(response);
        });

});
于 2012-11-12T07:31:06.413 に答える
1

通常の方法でフォームを送信する代わりに、result.php を Ajax (たとえば jQuery.post()) で呼び出すことを検討してください。その後、success-callback を使用して戻り値を挿入できます。

于 2012-11-12T07:07:10.603 に答える
1

あなたはjqueryとajaxでこれを行うことができます.以下は簡単な方法です

result.php の内容:

<?php
   $received=$_POST['pass'];
   echo 'Received: '.$received;
?>

のような ajax リクエストを作成し、id="from_one" のようなフォーム ID を作成します。

$("#from_one").submit(function(){
$.ajax({
  url: 'result.php',
  type: "POST",
  data:{pass:$('input[type=pass]')}
  success: function(data) {
     //here append the result to the div you want 
     // in data you will get the result 
  }
});
});
于 2012-11-12T07:11:24.070 に答える
0

以下を試してください：

form.htmlでフォームタグを変更します：

<form method="POST" action="" onsubmit="return callphp()">

index.html に関数 callphp() を追加します。

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

      }
      }  
       xmlhttp.open("POST","result.php",true);
       xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
       xmlhttp.send();
}
于 2012-11-12T07:12:24.073 に答える
0

results.php を div に含めて、適切な場所に配置します。

于 2012-11-12T07:05:21.030 に答える
0

より大きなプロジェクト (これら 2 つのサイトだけでなく) を計画している場合は、web サイト テンプレート(index.html 用)を作成することをお勧めします。

ここで良いアプローチを見つけることができます

于 2012-11-12T07:16:45.810 に答える