< form method =“link” >或< a&gt ;?有什么不同？ [英] <form method="link" > or <a>? What's the difference?

问题描述

我看到我们可以写出：

 < form method =linkaction =foo.html> 
< input type =submit/> 
< / form> 
  

制作一个链接按钮。

但是我知道我们可以写：

 < a href =foo.html>< input type = button/>< / a> 
  

哪一个可以做到。

有什么不同？什么是他们的浏览器兼容性？ 您链接到的页面不正确。没有 method =LINK值。这将导致表单回退到默认方法 GET ，这相当于一个带有 href


 < form method =GETaction =foo.html> 
< input type =submit/> 
< / form> 
  

这与您的示例相同，但是有效;并相当于：



 < a href =foo.html> 
  

您应该使用语义来确定实现窗体的方式。由于没有表单字段供用户填写，因此这不是真正的表单，因此您不需要使用< form> 来获得效果。 / p>



何时使用 GET 表单是一个搜索框：

 < form action =/ search> 
< input type =searchname =qplaceholder =Searchvalue =dog/> 
< button type =submit>搜寻< /按钮> 
< / form> 
  

上面的代码允许访问者输入自己的搜索查询，而这个锚点元素不会：

 < a href =/ search？q = dog>搜索dog< / a> 
  

然而，当提交/点击时，它们都会进入同一页面（假设用户不更改在第一个文本字段中



---

另外，我使用下面的CSS来获取类似按钮的链接：

 按钮，
。按钮a {
光标：指针; 
字体大小：9.75pt ; / * WebKit中的最大大小以获得原生外观按钮而不使用缩放* / 
 -moz-user-select：none; 
 -webkit-user-select：none; 
 -webkit- tap-highlight-color：transparent; 
} 
 .buttons a {
 margin：2px; 
 padding：3px 6px 3px; 
 border：2px outset buttonface; 
 background-color：buttonface; 
 color：buttontext; 
 text-align：center; 
 text-decoration：none; 
 -webkit-appearance：button; 
} 
按钮img，
 .buttons a img {
 -webkit-user-drag：none; 
 -ms-user-drag：none; 
} 
 .buttons表格{
 disp躺着：内联; 
 display：inline-block; 
} 
  

I saw that we can write:

<form method="link" action="foo.html" >
<input type="submit" />
</form>

To make a "link button".

But I know we can write:

<a href="foo.html" ><input type="button" /></a>

Which will do the same.

What's the difference? What's their browser compatibility?

解决方案

That page you link to is incorrect. There is no method="LINK" value. This will cause the form to fall back to the default method, GET, which is equivalent to an anchor element with a href attribute anyway.

<form method="GET" action="foo.html">
    <input type="submit" />
</form>

This is the same as your example, but valid; and is equivalent to:

<a href="foo.html">

You should use semantics to determine which way to implement your form. Since there are no form fields for the user to fill in, this isn't really a form, and thus you need not use <form> to get the effect.

An example of when to use a GET form is a search box:

<form action="/search">
    <input type="search" name="q" placeholder="Search" value="dog" />
    <button type="submit">Search</button>
</form>

The above allows the visitor to input their own search query, whereas this anchor element does not:

<a href="/search?q=dog">Search for "dog"</a>

Yet both will go to the same page when submitted/clicked (assuming the user doesn't change the text field in the first

---

As an aside, I use the following CSS to get links that look like buttons:

button,
.buttons a {
    cursor: pointer;
    font-size: 9.75pt;  /* maximum size in WebKit to get native look buttons without using zoom */
    -moz-user-select: none;
    -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;
}
.buttons a {
    margin: 2px;
    padding: 3px 6px 3px;
    border: 2px outset buttonface;
    background-color: buttonface;
    color: buttontext;
    text-align: center;
    text-decoration: none;
    -webkit-appearance: button;
}
button img,
.buttons a img {
    -webkit-user-drag: none;
    -ms-user-drag: none;
}
.buttons form {
    display: inline;
    display: inline-block;
}

这篇关于< form method =“link” >或< a&gt ;?有什么不同？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！