PHP - Jquery - 初学者 - 我做对了吗？ [关闭]

Question

我正在做一个小项目，我以前从未使用过 Jquery。在采取更多措施之前，我想知道我是否走在正确的道路上。

这基本上是我的用户界面：

 <ul id="Navigation">
      <li id="HomeButton">Home</li>
      <li id="NewsButton">News</li>
      <li id="AboutUsButton">AboutUsButton</li>
 </ul>

 <div id="Content"></div>

 <script type="text/javascript">
      $("#HomeButton").on("click", function(){
           $("#Content").load("pages/home.php");
      }); 
      $("#NewsButton").on("click", function(){
           $("#Content").load("pages/news.php");
      });  
      $("#AboutUsButton").on("click", function(){
           $("#Content").load("pages/asbout_us.php");
      });           
 </script>

这是构建动态 jquery UI 的正确方法吗？

---

这基本上是我做数据库相关工作的方式：

动作的文件名：

 clear_inventory.php

此代码在数据库表中将库存槽设置为 0 并回显结果。

动作相关的UI：

 <button id="ClearInventoryButton">Clear Inventory</button>

 <div id="ClearInventoryResult"></div>

 <script type="text/javascript">
      $("#ClearInventoryButton").one("click", function(){
           $("#ClearInventoryResult").load("actions/clear_inventory.php");
      });

这是正确/安全的方式吗？

提前感谢您的回答。

抱歉，如果之前有人问过这个问题。

Answer 1

对于您的第一个问题，您应该努力避免多余并使用像class 这样的通用选择器，然后使用this 来缩小选择范围：

<ul id="Navigation">
      <li class="nav_btn" data-link="pages/home.php">Home</li>
      <li class="nav_btn" data-link="pages/news.php">News</li>
      <li class="nav_btn" data-link="pages/asbout_us.php">AboutUsButton</li>
</ul>

<script type="text/javascript">
      $("#Navigation").on("click",".nav_btn", function(){
           window.location  =   $(this).data("link");
      });
</script>

关于你的第二个问题，你听起来像是在谈论 AJAX，不清楚所以我不能对此发表评论。

编辑：关于 AJAX：

您需要使用 $.get、$.post、$.ajax 函数进行 ajax 调用，例如：

$("#ClearInventoryButton").click(function() {
    $.ajax({
            url: 'actions/clear_inventory.php',
            type: 'post',
            data: { reset: true }
            success: function(response) {
                    $("#ClearInventoryResult").html(response);
                }
            });
    });

Answer 2

这取决于页面实际有什么。首先看看the jQuery docs for Load() - 它有完整的处理程序，我建议你使用。在您的代码可以工作的那一刻，禁止最后一个带有“one”而不是“on”的 sn-p。

我会使用完成和错误处理程序，因此如果 PHP 的服务器端出现问题并且您收到错误代码，您可以对其进行处理。您还可以使用 Load() 加载页面的片段 - 假设您在家里有两个 div，一个称为我的帐户，另一个称为概览，如果有人单击新菜单项“概览”，您可以加载主页并告诉 Load () 只取概览 div。