Question

我有两个名为testing.php和submission.php的网页。我希望实现的是从testing.php发送数据以在submission.php中显示该数据。例如，如果用户点击test1，他们会被定向到submission.php，我想在该页面上显示test1。这是我的代码：

testing.php：

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
</head>
<body>  
    <div class="col-xs-3">
        <ul id="choose">
            <li class="nav"><a href="submission.php">test1</a></li>
            <li class="nav"><a href="submission.php">test2</a></li>
            <li class="nav"><a href="submission.php">test3</a></li>
            <li class="nav"><a href="submission.php">test4</a></li>
            <li class="nav"><a href="submission.php">test5</a></li>
            <li class="nav"><a href="submission.php">test6</a></li> 
        </ul>
    </div>

    <script>
        $(document).ready(function() {    
            $("#choose").on('click', '.nav', function() {
                $.post("submission.php", { data: $(this).text() }, alert($(this).text()));               
            });
        });
    </script>
</body>

submission.php：

<?php
    $subcat = $_POST['data'];
    echo $subcat;
?>

目前，submission.php显示以下错误;

注意：未定义的索引：第2行的C：\ xampp \ htdocs \ series \ dynamics \ admin \ CleanURL \ submission.php中的数据

提前感谢您对此进行调查，请建议我如何解决此问题！

Answer 1

这就是发生的事情：

您点击了链接
事件触发
JavaScript运行
准备好Ajax请求
遵循链接
Ajax请求已中止，因为它所在的页面不再存在

$_POST为空，因为您通过关注链接发出常规GET请求。

首先，be unobtrusive。

用表单替换链接（或者设计系统以使用GET请求，这取决于what the system is doing）。在其中放入隐藏的输入以设置data的值。

然后，把它变成Ajaxy：

将事件处理程序绑定到表单提交事件
捕获事件对象
防止默认行为

您还需要将函数作为第三个参数传递给$.post。

这样：

$("#choose").on('submit','form', function(event){
  event.preventDefault();
  $.post(
      "submission.php",
      {data: this.form.data.value}, 
      function (response) { alert(response); }            
   );
});

Answer 2

最容易实现这一点是使用GET并且不需要javascript。

<ul id="choose">
    <li class="nav"><a href="submission.php?data=test1">test1</a></li>
    <li class="nav"><a href="submission.php?data=test2">test2</a></li>
    <li class="nav"><a href="submission.php?data=test3">test3</a></li>
    <li class="nav"><a href="submission.php?data=test4">test4</a></li>
    <li class="nav"><a href="submission.php?data=test5">test5</a></li>
    <li class="nav"><a href="submission.php?data=test6">test6</a></li> 
</ul>

您的submission.php。

<?php
$subcat = $_GET['data'];
echo $subcat;
?>

但是，如果你真的想/需要使用POST，那么它需要更多代码并需要javascript。首先将ul包装在表单中，并为每个项添加无线电输入并隐藏它们：

<form action="submission.php" method="post">
    <ul id="choose">
        <li class="nav"><input type="radio" name="data" value="test1" style="display: none" /><a href="#">test1</a></li>
        <li class="nav"><input type="radio" name="data" value="test2" style="display: none" /><a href="#">test2</a></li>
        <li class="nav"><input type="radio" name="data" value="test3" style="display: none" /><a href="#">test3</a></li>
        <li class="nav"><input type="radio" name="data" value="test4" style="display: none" /><a href="#">test4</a></li>
        <li class="nav"><input type="radio" name="data" value="test5" style="display: none" /><a href="#">test5</a></li>
        <li class="nav"><input type="radio" name="data" value="test6" style="display: none" /><a href="#">test6</a></li> 
    </ul>
</form>

当您点击链接时，请使用javascript检查正确的无线电输入并提交表单。

$("#choose").on('click', '.nav', function() {
    $(this).find('input').prop('checked', true);
    $('form').submit();               
});

然后你可以使用你的submission.php代码。

<?php
$subcat = $_POST['data'];
echo $subcat;
?>

Answer 3

使用表单

<form action="submission.php" method="post">
Name: <input type="text" name="name"><br>
<input type="submit">
</form>

使用AJAX

   var data = (this).text();
    $.ajax({
      method: "POST",
      url: "submission.php",
      data: { li_selected: data}
    })
      .done(function( msg ) {
        alert( "Response: " + msg );
      });

我认为你想使用ajax。

使用ajax将数据从一个页面传递到另一个页面

3 个答案: