Ajax 没有将我重定向到下一页

Question

我正在尝试将单击图像的 ID 传递到下一页。 当我开发我的代码时，它并没有将我重定向到下一页。 当我单击 F12 并检查网络中的 POST 时，它显示变量已正确传递到下一页，如附图所示，但它没有将我重定向到下一页。 所以现在我知道该变量在下一页中正确传递和接收，但我需要在我的代码中将我引导到下一页，注意：当我尝试将window.location.href = 'userevent.php'; 它重定向我但没有变量并给我错误（注意：未定义的索引：点击）另外，当我使用url: '@userevent.php.Action("delivery", "service")', ，它给我网络状态403 这是我的代码：

  <?php
    session_start();

    require "init.php";
    login();
?>


<html>
<!--...-->
    <head>
        <meta charset="utf-8">
        <title> Ghost </title>
    <!--    <link rel="Stylesheet" href="css/style1.css">-->

    <link rel="stylesheet" href="css/style2.css" media="screen" type="text/css" />
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script >


function myFunction(clicked) {
  document.getElementById('test').innerHTML = clicked;

  $.ajax({
     type: "POST",
     //url: '@userevent.php.Action("delivery", "service")', 
     url: 'userevent.php', 
     dataType:'json', 
     data: {"clicked": clicked},
     success: function(data){
     }
});
window.location.href = 'userevent.php';
}
</script>
    </head>

    <body>  

    <div class="sidenav">   
   <a href="#Main Page">Main Page</a>
  <a href="#About Us">About Us</a>

</div>



<div class="login-box">
  <h1>Add Event</h1>
  <div>
  <p id="test"> </p>

<?php
// LOGIN USER
function login(){
    global $con;
    global $counter;
echo "<table  align='center'  >";
    //$email = $mysqli->escape_string('');
    $query="SELECT * FROM events ORDER BY ID ASC";
    $result=mysqli_query($con,$query);
    if ( $result->num_rows == 0 ) // User doesn't exist
        echo "User with that ID doesn't exist!";
    else { // User exists
     $counter = 0;
     $emptyArray = [];


while($row = $result->fetch_assoc()) 
   {
       $emptyArray[$counter]= $row["ID"];
       if($counter == 0)
       {
           echo '<tr>';
       }
       echo '<td><img id=' . $row["ID"]. ' onClick="myFunction(this.id)" src="images/' . $row["photo"]. '" width="250px"  height= "250px" alt="Avatar" >
        <h1 id = "GFG_DOWN" style =  
            "color:white;text-align:center; font-size: 20px; font-weight: bold;"> '.$emptyArray[$counter].'
        </h1> </td>';
       $counter++;
       if($counter == 3)
       {
            echo "</tr>";
            $counter = 0;
       }
  }
    }
}

mysqli_close($con);
?>

这是第二页中的代码：

<div class='textbox'>
    <label> ID: ".$_POST['clicked']."</label>
  </div>

Answer 1

Ajax 的全部要点是，该请求是使用 JavaScript 发出的，并且响应由 JavaScript 处理，而无需导航到新页面。

如果要发出 POST 请求并导航到结果页面，请使用<form>

 window.location.href = 'userevent.php';
它重定向我但没有变量

将 URL 分配给location.href会触发浏览器导航（带有 GET 请求）到该 URL。

这是与 Ajax 请求完全不同的请求，因此它没有来自该请求的数据。

再次：为此使用表格。

我从数据库中读取数据，并获得了图像的点击 ID。

将您要发送的数据放在提交按钮中。

<form method="POST" action="userevent.php">
    <?php while($row = $result->fetch_assoc())  ?>
        <button name="clicked" value="<?php echo htmlspecialchars($row["ID"]); ?>">
            <img src="images/<?php echo htmlspecialchars($row["photo"]); ?> alt="Put useful and unique alt text so people know what they are selecting if they can't see the image">
        </button>
    <?php } ?>
 </form>

Answer 2

我认为您最好制作一个小表单，因为您希望在单击时将用户发送到新页面。

<?php while($row = $result->fetch_assoc())  ?>
    <form action="userevent.php" method="POST">
        <input type="hidden" name="clicked" value="$row["ID"]">
        <img src="images/{{ $row['photo'] }}" class="img">
    </form>
<?php } ?>
$('.img').click(function() {
    this.form.submit();
});

*已编辑以反映您当前的编辑。

Ajax 没有将我重定向到下一页

问题描述

2 个解决方案

解决方案1
1 已采纳 2020-06-05 15:28:39

解决方案2
0 2020-06-05 13:29:19

Ajax 没有将我重定向到下一页

问题描述

2 个解决方案

解决方案1 1 已采纳 2020-06-05 15:28:39

解决方案2 0 2020-06-05 13:29:19

解决方案1
1 已采纳 2020-06-05 15:28:39

解决方案2
0 2020-06-05 13:29:19