0

我有一个 PHP 网站，允许用户搜索图书馆目录，然后选择/添加书籍到购物车。这一切都很好，但我们希望在搜索结果表中实现 AJAX，这样就无需单击运行另一个 php 脚本的链接来将所选记录添加到他们的购物车，而是在同一页面内内联。当他们“选择”一条记录并弹出回到页面顶部时，这将删除搜索结果页面刷新（如果您在页面底部，这很烦人）。

我发现了一个使用链接实现 AJAX 的类似示例——这是我第一次使用 AJAX——但是当用户单击链接时没有任何反应，我被卡住了。

这是我的脚本：

function selectRecord() {
   // Allocate an XMLHttpRequest object
   if (window.XMLHttpRequest) {
      // IE7+, Firefox, Chrome, Opera, Safari
      var xmlhttp=new XMLHttpRequest();
   } else {
      // IE6, IE5
      var xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }
   // Set up the readyState change event handler
   xmlhttp.onreadystatechange = function() {
      if ((this.readyState == 4) && (this.status == 200)) {
         document.getElementById("selectRecord").innerHTML=xmlhttp.responseText;
      }
   }
   // Open an asynchronous POST connection and send request
   xmlhttp.open("POST", "selectRecord.php", true);
   return false;  // Do not follow hyperlink
}

这是带有链接的表格单元格：

<td class="hidden-narrow" id="selectRecord">
                <?php
                if (in_array($bookID, $_SESSION['selectedBooks'])) {
                    echo "Selected";
                } else {
                echo '<a href="select" onclick="return selectRecord()" class="center">Select</a>';
                }
                ?>
                </td>

如果不清楚我所追求的结果是表格单元格中的链接（“选择”） - 当用户单击此链接时，它会执行 selectRecord.php 脚本，该脚本将回显“已选择”或错误消息（如果有）是一个错误。目前，当用户单击“选择”链接时没有任何反应。

我还需要弄清楚如何将 $bookID PHP 变量传递给 AJAX 脚本，以便 selectRecord.php 知道要将哪个 Book ID 添加到购物车中。

4

1 回答 1

0

您可以像这样向您的 selectRecord() 调用添加一个参数：

echo '<a href="select" onclick="return selectRecord('.$bookID.')" class="center">Select</a>';

然后您的 selectRecord 函数应如下所示：

function selectRecord(id) {
   // Allocate an XMLHttpRequest object
   if (window.XMLHttpRequest) {
      // IE7+, Firefox, Chrome, Opera, Safari
      var xmlhttp=new XMLHttpRequest();
   } else {
      // IE6, IE5
      var xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }
   // Set up the readyState change event handler
   xmlhttp.onreadystatechange = function() {
      if ((this.readyState == 4) && (this.status == 200)) {
         document.getElementById("selectRecord").innerHTML="Selected";
      }
   }
   // Open an asynchronous POST connection and send request
   xmlhttp.open("POST", "selectRecord.php", true);
   xmlhttp.send("id="+id);
   return false;  // Do not follow hyperlink
}

只要您的文档中只有一个 ID 为 selectRecord 的元素，此方法就可以正常工作。您始终可以通过简单地将 BookId 编号添加为后缀来修改任何链接的 id。请注意，您的代码不起作用，因为它缺少对实际执行请求的 xmlHttpRequest 对象的 .open 调用。

于 2013-08-01T12:36:51.663 回答