时间戳

首页 > 解决方案 > 如何避免表单外的 HTML 按钮执行表单操作

php - 如何避免表单外的 HTML 按钮执行表单操作

问题描述

我的表单外部有一个按钮，它触发了一些 jQuery，但由于某种原因，它也执行了表单的操作。

我检查了这篇文章甚至在表单之外执行表单操作，但我没有导致问题的相同内容。

<form action="edit.php" method="post">
   <div class="table">
       <table cellspacing="0">
           <tr class="top">
              <th>Titel</th>
              <th>Auteur</th>
              <th>ISBN13</th>
              <th>Uitgever</th>
              <th>Pagina's</th>
              <th>ID</th>
              <th></th>
              <th></th>
           </tr>
       <?php

       $sql = "SELECT * FROM books";
       $result = $conn->query($sql);

       if ($result->num_rows > 0){
          while($row = $result->fetch_assoc()){
             ?> 
             <tr>
                <th><?php echo $row['title']; ?></th>
                <th><?php echo $row['author']; ?></th>
                <th><?php echo $row['isbn13']; ?></th>
                <th><?php echo $row['publisher']; ?></th>
                <th><?php echo $row['pages']; ?></th>
                <th><?php echo $row['id']; ?></th>
                <th><a href="edit.php?id=<?php echo $row['id']; ?>">Edit</a?</th>
                <th>
                   <form action="common/delete.php" method="post">
                      <button type="submit" name="delete">Delete</button>
                      <input type="hidden" name="id" value="<?php echo $row['id']; ?>">
                   </form>
                </th>
              </tr>
              <?php
           }
        } else {
            echo "Sorry, maar er zijn nog geen boeken in het assortiment.";
        }

        $conn->close();
        ?>
        </table>
    </div>
</form>
<button class="cancel2">Annuleren</button>

在我将所有代码添加到表中之前，jQuery 工作了，它仍然可以工作，但它也会将您发送到 edit.php，即使它在表单之外

标签： phpjqueryhtml

解决方案

该按钮被自动分配给表单，因为它没有任何其他功能。

$(document).on("submit","#list",function(e){
   e.preventDefault();
});

通过添加它，它将禁用按钮的默认提交功能，确保只有 jquery 被激活，没有别的。

推荐阅读