如何使用 POST 全局检查 javascript 提交的表单

Question

图一是网页在浏览器加载时的显示方式。图 2 是双击列表元素时的情况。图 3 显示了单击铅笔（这是原始表单元素）的结果。您可以看到列表项确实有一个可访问的值，因为它在警报中打印整数，所以我不确定下面的评论是否与此有关。我也不明白这是如何重复上一个建议的问题，因为单击 img 时它满足 $_POST['edit'] 的逻辑检查。请不要将其标记为重复，因为它不是！在答案中，我的问题被标记为重复 "img input elements cannot post data to the server and must be encased in a button"。在我看来，这一定是不正确的，因为如果我的页面不通过 post 传送数据，我的页面如何根据 img 点击更改状态，如果无法通过 img 点击设置 POST 变量向服务器传递数据。如果一个问题被标记为重复，那么原始答案必须解决相同的问题 and/or 包含正确的信息，如果没有，那么我认为这个问题应该作为原始问题！

<html>
<head>
<script  src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>

<body>
<?php
  if(isset($_POST['edit']) ) 
  {
  ?>
    <p>window is in edit mode</p>
  <?php
  }
  else
  {
  ?>
    <p>window is not in any mode</p>
    <form id="form-edit"  method="POST" name="form-edit"  action=" <?php echo $_SERVER['PHP_SELF']; ?>">
      <input type="image" id="edit-button" name="edit" value="1"  src="../images/pencil.png" class="course-banner-edit"> 
    </form>
    <?php
    }
    ?>
    <script>
      $(document).ready(function() {

       /**********************************************
       PROBLEM WITH THIS FUNCTION 
       **********************************************/  
        $('li').dblclick(function() {
          $('#form-edit').submit();
       /******************************************
      THE ALERT TRIGGERS AND THE VALUE IS REPORTED AS ONE WHICH IS CORRECT
        *****************************************/  
          alert( $("input[name=edit]").val() );
        });
     }); 
     </script> 
   </body>
  </html>

Answer 1

图像类型的输入元素不接受值属性。尝试这样的事情：

<form id="form-edit" method="POST" name="form-edit" action="<?php echo $_SERVER['PHP_SELF']; ?>">
    <button type="button">
        <img src="" alt="">
    </button>
    <input type="hidden" name="edit" value="1">
</form>

为了更好地了解它的工作原理，尝试使用不同的按钮提交此表单，看看会发生什么

<html>
<head>
</head>

<body>
<?php var_dump($_POST); ?>
<form id="form-edit" method="POST" name="form-edit" action="#">
    <input type="image" id="edit-button" name="first_submit_button" src="...">
    <input type="image" id="edit-button" name="second_submit_button" src="...">
    <input type="submit" value="third submit button">
</form>

<ul>
    <li>submit via javascript</li>
</ul>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
  $(document).ready(function() {
    $('li').click(function() {
      $('#form-edit').submit();
    });
  });
</script>
</body>
</html>

如何使用 POST 全局检查 javascript 提交的表单

How do I check a javascript submitted form using the POST global

javascript

php

forms

form-submit