Jquery Ajax在后台运行的多个页面上发布数据

Jquery Ajax Post data on multiple pages running on background

本文关键字：布数据 数据 后台 Ajax 运行 Jquery      更新时间：2023-11-06

如何在多个页面上执行Jquery Ajax发布数据。

例如，我使用了三个页面，分别命名为Page1、Page2和Page3。我需要从第1页->第2页和第2页->第3页发布数据。用户仅在Page1上启动，所有其他功能都应在后台执行。这可能吗？

这是使用的代码。

Page1.php:

<html>
<head><title>Page1</title></head>
<script src="/path to/jquery.min.js"></script>
<body>
<button  type="button" class="btn" id="bt">SEND</button>
<script>
var a1="Hello";
var b1="Testing Ajax";
$(function(){
$('#bt').click(function(){
 $.ajax({
      url: 'Page2.php',
        type: 'POST', 
       data: {'w1': a1,'w2':b1}, 
     alert("Data Sent...");     
        }, 
       error: function() {
         alert("Unable to send data now.");
        } 
   });}); }); 
</script>
</body>
</html>

Page2.php:

<html>
<head><title>Page 2 </title></head>
<body>
<?
 $r1 = $_POST['w1'];
 $r2 = $_POST['w2'];
?>
<div id="dom1" style="display: none;">
<?php 
    $r1 = $_POST['w1'];
    echo htmlspecialchars($r1); 
?>
</div>
<div id="dom2" style="display: none;">
<?php 
   $r2= $_POST['w2'];
    echo htmlspecialchars($r2); 
?>
</div>  
<script>
var div1 = document.getElementById("dom1");
var m1 = div1.textContent;
//alert(m1);
var div2 = document.getElementById("dom2");
var m2 = div2.textContent;
//alert(m2);
 $.ajax({
      url: 'Page3.php',
        type: 'POST', 
       data: {'x1': m1,'x2':m2}, 
     alert("Data Sent...");     
        }, 
       error: function() {
         alert("Unable to send data now.");
        } 
   });
</script>
</body>
</html>

Page3.php:

<html>
<head>
<title>Page3</title></head>
<body>
<div id="dom3">
<?php 
    $r1 = $_POST['x1'];
    echo htmlspecialchars($r1); 
?>
</div>
<div id="dom2">
<?php 
   $r2 = $_POST['x2'];
    echo htmlspecialchars($r2); 
?>
</div>
</body>
</html>

有几种方法可以解决您的问题。

  1. PHP会话你可以很容易地在你的每个页面上开始一个会话并发布

    <?php
// every page needs to start the session
session_start();
// after submission or posting
$_SESSION['data'] = $your_data;
?>

    因此，在您的下一个页面上，您可以通过会话轻松访问您的数据。

    <div>
    <?= $_SESSION['data']['var1'] ?>
</div>

  2. 使用Forms并通过jQueryajax请求发送它们，并将下一页上的表单值放入隐藏的输入元素中。

    <!-- example for page 2 -->
<form id="your_form" method="post" action="">
    <input type="hidden" name="var1" value="<?= $var1 ?>">
    <input type="hidden" name="var2" value="<?= $var2 ?>">
    <input type="submit" id="submit" name="submit" value="submit">
</form>
<script type="text/javascript">
    $('#submit').on('click', function( event ) {
        event.preventDefault();
        $.ajax({
            url : your_url,
            type : 'POST',
            data : $('#your_form').serialize();
         });
    });
</script>

  3. 只是不要使用ajax。你真的不需要它，从一页跳到另一页。看下面的例子。

    <!-- on page1.php just a quick form -->
<form id="form1" method="post" action="page2.php">
    <label for="var1">Var 1</label>
    <input type="text" name="var1" id="var1" value="">
    <input type="submit" name="submit" value="submit">
</form>
<!-- on page2.php just another quick form with hidden elements -->
<form id="form2" method="post" action="page3.php">
    <label for="var2">Var 2</label>
    <input type="text" name="var2" id="var2" value="">
    <input type="hidden" name="var1" value="<?= $_POST['var1'] ?>">
    <input type="submit" name="submit" value="submit">
</form>

在每3个给定的例子中，你都应该考虑安全的东西，比如转义post-vars等。

相关文章：