如何在没有表单回发的情况下严格地在 XHTML 中制作一个简单的 jQuery 按钮？

Question

我正在使用 DOCTYPE XHTML Strict 创建一个网站，如果我在 form 之外有 输入按钮 或 按钮元素，它会报错。

所以我把它放在一个表单中，它抱怨我没有 action 属性。

所以我输入了一个 action 属性，然后将按钮回发到页面，这是我不想要的。

我怎样才能在 XHTML strict 中有一个带有绑定事件的普通 jQuery 按钮？

<form action="">
    <div>
        <input id="button1" type="button" value="highlight it"  /> 
        <input id="button2" type="button" value="toggle title" />
        <p>here is another paragraph</p>    
    <div id="show1">What color is the sky?</div>
    <div id="answer1">blue</div>
        <button id="button1">Show Answer</button>
    </div>
</form>

Answer 1

我正在使用 DOCTYPE XHTML Strict 创建一个网站，如果我在表单外有输入按钮或按钮元素，它会报错。

不，没有表单的输入/按钮是完全可以接受的。实际上，在 DTD 中没有办法表达输入必须有一个表单祖先的限制，所以 XHTML 不能禁止它，如果它愿意的话。如果您有验证错误，则不是这样。大概是这样的：

<button id="button1">Show Answer</button>

您已经有了一个带有id="button1" 的元素。 id 必须是唯一的。

当您不打算提交表单时，通常不应包含表单元素。但是，有一种情况需要：将一组具有相同控制 name 的 radio 输入分组。如果他们没有表单祖先，他们就不知道他们是连接的，所以浏览器往往不会让他们独占。

在这种情况下，通常的习惯用法是将所需的action属性设置为"#"，并在始终返回false的表单中添加onsubmit处理程序，这样当启用JS时，表单将永远不会提交。 不要将此return false 放在按钮本身上，因为表单可能通过按钮单击以外的其他方式提交：特别是 Enter 键。

所以我输入了一个 action 属性，然后将按钮回发到页面，这是我不想要的。

<input type="button"> 不会提交表单。 <button> 也不应该，但它在 IE 中是由于浏览器使用错误的默认 type 值的错误。所以你必须写<button type="button">。

Answer 2

诀窍是从您的 click() 处理程序中返回 false，如下所示：

$("#button_id").click(function() { /* do stuff.. */ return false; })

Answer 3

这就是你不应该使用 xhtml strict 的原因。如果你做某事的唯一原因是为了取悦验证者，那么验证者就错了。请改用html5，并按照您最初的方式进行操作，即没有表单。