提交按钮仅用作锚点的链接

Posted 2023-03-06

【中文标题】提交按钮仅用作锚点的链接

【英文标题】：Submit button works only as link to anchor

【发布时间】：2015-01-28 06:34:30

【问题描述】：

我有以下代码：

<form enctype="multipart/form-data" id="search_form" name="search_form" action="thisfile.php#anchorname" method="get">

<!-- Lots of search fields here -->

<input name="search" type="submit" value="Search" />
</form>

<?php if (isset($_GET['search'])) 
// Search in database
?>
<div id="anchorname">
<!-- Table with results here -->
</div>
<?php

这在 IE 中运行良好（我知道这很疯狂），但在 Chrome 和 Firefox 中，提交表单并显示结果表后，按钮不会重新提交表单，只会使页面向下滚动到锚名称。在 Chrome 中，我可以通过单击地址栏并按 Enter 来重新加载页面，但是当我在 Firefox 中这样做时，什么也没有发生。我做错了什么？

【问题讨论】：

不要使用 div 锚，尝试<a name="anchorname"></a> 并将 div 包裹在它周围，不要命名它，或者命名它的其他名称。

使用%23在表单操作中编码哈希

两个都试过了，建议都不管用。

使用POST方式，尤其是因为你使用multipart/form-data编码。

谢谢！我已经删除了enctype="multipart/form-data"，现在我正在使用客户端方法。不过我还是很疑惑：为什么可以提交但不能重新提交？

【参考方案1】：

如果这对任何人都有用，这就是我使用 JQuery 所做的：

$(function() 
    // ...
    <?php if (isset($_GET['search']))  ?>
        var target = $("#anchorname");
        $('html,body').animate(
            scrollTop: target.offset().top
        , 500);
    <?php  ?>
);