0

让我详细解释一下我想要实现的目标。我有 3 页:index.html、form.html 和 result.php。当我单击 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

不要以正常方式提交表单,而是考虑使用 Ajax 调用 result.php(例如 jQuery.post())。然后您可以使用成功回调来注入返回值。

于 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

如果您打算做一个更大的项目(不仅仅是这两个站点),我建议您创建一个网站模板(为您的 index.html)

你可以在这里找到一个好方法

于 2012-11-12T07:16:45.810 回答
0

将您的 results.php 包含在 div 中以将其放在正确的位置。

于 2012-11-12T07:05:21.030 回答
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 回答