j查询表单提交不会返回 false

jQuery form submission will not return false

本文关键字：返回 false 查询 表单提交      更新时间：2023-09-26

目前jQuery有点问题。我有一个表，我的目标是有一个删除按钮，单击时，它会将其从 mySQL 后端中删除。我在功能方面没有问题，我的问题是我无法让 jQuery 返回 false，它不断重定向到我在表单标签中指向的 php 脚本。如果您发现代码有问题，请告诉我。

我设置了一个表结构，这只是为了显示从 mysql 查询返回的所有行。也许我没有正确设置表单。

<?php
if (sizeof($rows5) > 0) {
    foreach($rows5 as $row5):
    echo"
<tr class='tableRowClass2'>
<td>{$row5['PackingSlipStarmontID']}</td>
<td>{$row5['fullStarmont']}</td>
<form action='delete/starmont.php' method='post' name='deletestarmontForm' id='deletestarmontForm'>
<td>
    <button id='button3'>Remove</button>
    <input type='hidden' id='PackingSlipStarmontID' name='PackingSlipStarmontID' value='{$row5['PackingSlipStarmontID']}'/>
</td>
</form>
</tr>";
    endforeach;
}
?>

这是jQuery，假设在提交表单后阻止页面重定向。

$(document).ready( function() {
    $("#button3").click( function() {
        $.post( $("#deletestarmontForm").attr("action"), 
            $("#deletestarmontForm :input").serializeArray(), 
            function(info){
                $("#result4").html(info); 
           });
        });
        $("#deletestarmontForm").submit( function() {
            return false;   
        });
        function clearInput() {
        $("#deletestarmontForm :input").each( function() {
           $(this).val('');
        });
    }
});

因此，这段代码在调用 php 脚本并且 SQL 查询很好的情况下起作用。问题是它会重定向到该 php 页面，而不是在提交时返回 false。

*编辑***谢谢大家的帮助。在此和实验之间，我已经解决了这个问题。似乎问题与重复的ID有关。我使用的代码与我发布的代码相同，但我没有使用 ID 选择器，而是通过将其更改为类选择器来解决它

不能多次使用相同的 ID。因此，请注意，我已将 ID 更改为类。

<?php
if (sizeof($rows5) > 0) {
    foreach($rows5 as $row5):
    echo"
<tr class='tableRowClass2'>
<td>{$row5['PackingSlipStarmontID']}</td>
<td>{$row5['fullStarmont']}</td>
<td>
    <button class='button3'>Remove</button>
    <input type='hidden' id='PackingSlipStarmontID' name='PackingSlipStarmontID' value='{$row5['PackingSlipStarmontID']}'/>
</td>
</tr>";
    endforeach;
}
?>

然后，你需要更改你的jQuery代码。您需要阻止按钮的默认行为。

$(document).ready( function() {
    $(".button3").click( function(event) {
     event.preventDefault();
     var value = $(this).siblings('input[type=hidden]').val();
     $.post( "/your/path", 
             { value : value }, 
             function(info){ $("#result4").html(info); 
       });
    });
});

表单将由 $.post 提交，但 event.prevenDefault(( 将禁止提交表单。

你可以试试这个e.preventDefault() 

$("#button3").click( function(e) {
    e.preventDefault(); // <-- prevents default action
    // rest of the code
});

默认操作是转到要阻止的表单页面。

$("#button3").click( function(e) {
    e.preventDefault();
    // rest of submit stuffs
});

$("#button3").click( function(e) {
    e.preventDefault();
});
表单

操作导致它转到 PHP 页面。 us jQuery 来禁止默认操作，因为您让按钮运行您的函数。 

 $("#deletestarmontForm").submit( function() {
  return false;
  event.preventDefault();
});

我想会的。

虽然所有其他答案都很好地说明了使用e.preventDefault，但我认为这不是您问题的原因。 return false;应该做你想做的事就好了。 你可以看到你的代码在这个小提琴中工作。 我的猜测是你的代码还有其他事情。 可能是阻止处理程序正常运行的 JS 错误(检查您的控制台(，因此回退行为是原始表单提交。

相关文章：