单击 PHP 中的菜单选项时 POST 方法不起作用

Question

我正在尝试为我的网站构建菜单。当我单击菜单时，它应该 POST 到 index.php 但没有任何反应。我已经使用 console.log 进行了检查，分配给 data-val 的值正在输入，但隐藏的 INPUT 不起作用。有人可以通过指出问题来指明正确的方向。谢谢

这里是 JQuery

       $(document).ready(function($) {
           $('ul li a').on('click', function() {
               $('#shareto').val($(this).data('val'));
           });
       });

这里是 HTML

    <form name="mainmenu" id="mainmenu" method="post" action="index.php">
        <table border="0" cellpadding="0" cellspacing="0" width="100%">
        <tr>
            <td width="96%" height="50" background="images/headerPanel.jpg" valign="center">
                <font face="verdana" size="1" color="white"> <h1 align="center">ABC Company</h1></font>
            </td>
            <td width="3%" background="images/headerPanel.jpg" valign="center" align="right">
                <input type="submit" name="submit" value="Logout" />
            </td>
            <td width="1%" background="images/headerPanel.jpg" valign="center"></td>
        </tr>
        </table>

        <table border="0" cellpadding="0" cellspacing="0" width="100%">
        <tr>
            <td width="2%" bgColor=#C11B17></td>
            <td width="16%" bgColor=#C11B17>
                <ul>
                    <li><a href="#">Maintanence</a>
                        <ul>
                            <li><a href="#" data-val="1-1">Add Category</a></li>
                            <li><a href="#" data-val="1-2">Add Sub-category</a></li>
                        </ul>
                    </li>
                    <li><a href="#">Process Order</a>
                        <ul>
                            <li><a href="#" data-val="2-1">Ship Order</a></li>
                            <li><a href="#" data-val="2-2">Change Order Status</a></li>        
                        </ul>
                    </li>
                    <li><a href="#">Reports</a>
                        <ul>
                            <li><a href="#" data-val="3-1">Orders by station</a></li>
                            <li><a href="#" data-val="3-2">Orders by date</a></li>
                            <li><a href="#" data-val="3-3">Pending Orders</a></li>
                        </ul>
                    </li>
                    <input id="shareto" type="hidden" name="shareto">
                </ul>
            </td>
        </tr>
        </table>
    </form>

Answer 1

您的问题是提交用于注销的表单按钮，如果您需要使用提交按钮进行注销，那么对于发送菜单项索引，您需要使用 ajax 查询而不需要“shareto”输入元素。之后在服务器端，您可以重定向正确的菜单页面。反之亦然。

这里是完整的代码： 客户端js文件：

$(document).ready(function($) {
    $('ul li a').on('click', function() {
        var menuItemIndex = $(this).data('val');
        $.ajax({
          type: "POST",
          dataType:'json',
          url: "index.php",
          data: {
               menuindex: JSON.stringify(menuItemIndex)
          },
          success: function(data, textStatus, jqXHR) {
              console.log(data.menu_location);
              window.location = data.menu_location;
          },
          error: function(errorMsg, textStatus, jqXHR) {
              console.log(errorMsg);
              console.log(textStatus);
              console.log(jqXHR);
          }
        });
     });
});

服务器端 index.php ：

<?php
     $menu_locations = array("1-1" => "URL_1.html", "1-2" => "URL2_.html");
     $menu_item_index = json_decode($_POST['menuindex']);

     header("Content-type: application/json");
     echo json_encode(array("menu_location" => $menu_locations[$menu_item_index]));

Answer 2

您需要提交表单才能发布数据...使用 jquery submit() 提交表单..

试试这个

   $(document).ready(function($) {
       $('ul li a').on('click', function() {
           $('#shareto').val($(this).data('val'));
           $('#mainmenu').submit();
       });
   });

Answer 3

jquery 需要是：

   $(document).ready(function($) {
       $('ul li a').on('click', function() {
           $('#shareto').val($(this).data('val'));
           $('#mainmenu').submit();
       });
   });