Question

我有一个带有两个提交按钮的表单。那不是问题;我能做到的就好了。让我们切入追逐。这是HTML：

<!-- Assume there's a lot more document here. -->
<form action="place1.html" method="GET">
    <input type="submit" value="Go to Place 1!" />
    <input type="submit" formaction="place2.html" value="Go to Place 2!" />
</form>

第一个按钮完全按预期工作。第二个按钮很奇怪 - 它实际上转到了place1.html，除非你点击最右边的十个像素 - 然后它转到place2.html。有谁知道这里发生了什么？我在Google Chrome和Internet Explorer上测试过它。这是我的HTML吗？浏览器？我的电脑？

更新
好吧，所以我在页面上禁用了CSS - 这没什么区别。无论如何，没有任何CSS目标输入。我还从action标记中删除了form属性，并在第一个提交按钮中添加了formaction属性，根据Agony的建议 - 没有骰子。 :(但我会保留它，因为它感觉更干净。

这是我的环境的一点点。实际上，我在一个表单中包含的两个字段集中包含三个按钮。现在，它可能是div上的CSS。

<form id="server-form" method="post">
    <input type="hidden" name="custID" value="@Model.CustomerID" form="server-form" />

    <div style="float: left; width: 50%;">
        <fieldset>
            <legend>Fieldset One</legend>
            <!-- Content goes here -->
            <p><input type="submit" formaction="/page1.html" value="Go to Page 1" />
            <input type="submit" formaction="/page2.html" value="Go to Page 2" /></p>
        </fieldset>
    </div>

<div style="float: right; width: 50%;">
    <fieldset>
        <legend>Fieldset Two</legend>
        <!-- More and different content goes here -->
        <p><input type="submit" formaction="/page3.html" value="Go to Page 3" /></p>
    </fieldset>
</div>

为什么我之前没透露过这个？我希望尽可能地保持这种情况，以便在将其缩小到我的特定实例之前，看看是否有任何我刚刚遗失的愚蠢事情。
如果它有所不同，我也在使用带有Razor的ASP.NET MVC 4，但我认为不应该这样。

Answer 1

我没有发现使用Chrome，Firefox或IE的问题，但我建议您设置这样的HTML。

<form>
<input type="submit" formaction="place1.html" value="Go to Place 1!" />
<input type="submit" formaction="place2.html" value="Go to Place 2!" />
</form>

如果可能的话。否则，我想看看它背后的CSS，以确定为什么你的第二个按钮是这样的。

带有两个“提交”输入的HTML表单很奇怪

1 个答案: