html - HTML 中的 可以在没有 javascript 的情况下执行某些操作吗？

Question

我有一个带有按钮的网页。目前，我将此按钮绑定(bind)到一个 javascript 处理程序，该处理程序使页面在单击时重定向到给定的 URL。

HTML:

<button class="click-me">Clike me to navigate</button>

JS:

$('.click-me').on('click', function() { window.location = '/myloc'; });

我现在正在尝试构建此页面的后备(无 javascript)版本。我希望这个按钮做同样的工作，但不使用 javascript。换句话说，即使浏览器的 javascript 被禁用，我也试图使这个按钮起作用。

我知道这可以通过表单来实现(如下图)。但我正在寻找任何更简洁的实现。

<form name="hack" action="/myloc">
  <button type="submit" class="click-me">Click me to navigate</button>
</form>

Answer 1

使用 a 元素，这就是它们的作用:

<a class="click-me" href="/path/to/whatever/page">Click me to navigate</a>

然后简单地将其设置为按钮。

例如使用以下 CSS:

.clickMe {
    -moz-appearance: button;
    -ms-appearance: button;
    -o-appearance: button;
    -webkit-appearance: button;
    appearance: button;
    text-decoration: none;
    color: #000;
    padding: 0.2em 0.4em;
}​

JS Fiddle demo .

(显然，这假定使用支持 appearance(或供应商前缀版本)CSS 属性的浏览器。)

引用资料:

• appearance (albeit it's the -moz- prefixed MDN documentation) .
• appearance property, at the W3C .
• Unfortunately-dropped CSS3 features (at the W3C) .