Html 是否可以在 <input> 字段内放置链接？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21077208/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Is it possible to place a link inside <input> field?
提问by user3187469
Is it possible to place links on Login and on Register here?
是否可以在此处放置登录和注册链接？
<input type="text" class="formcontrol" value="Please Login or Register to view your tracking link.">
回答by zzzzBov
The <input>element may not have a close tag
Tag omission in text/html:
No end tag.
text/html 中的标记遗漏：
没有结束标记。
which means it may not contain HTML.
这意味着它可能不包含 HTML。
On top of that, it is Interactive Content, which means that it is not allowed to contain <a>elements (or any other Interactive Content). <textarea>is interactive content as well, so the following will not work either:
最重要的是，它是Interactive Content，这意味着它不允许包含<a>元素（或任何其他交互式内容）。<textarea>也是交互式内容，因此以下内容也不起作用：
<textarea>Please <a...>Login</a> or <a...>Register</a> to view your tracking link.</textarea>
If you want to use a placeholder for the field that includes links, you'll need to style an element to look like an <input>element:
如果要为包含链接的字段使用占位符，则需要将元素的样式设置为看起来像一个<input>元素：
input,
.input {
border: 1px solid #888;
box-sizing: border-box;
display: block;
font-family: sans-serif;
font-size: 14px;
line-height: 20px;
margin: 10px 0;
padding: 2px 5px;
vertical-align: baseline;
width: 300px;
}<input type="text" value="Looks like an input"/>
<div class="input">Looks like an input, <a href="#">but isn't</a></div>回答by iamkrillin
according to w3c, the end tag is forbidden on an input tag this means that you cannot place any element inside of an input tag
根据 w3c，输入标签上禁止使用结束标签，这意味着您不能在输入标签内放置任何元素
回答by Dan
No, what you'll want to do is emulate the <input>with a <div>. You can make the <div>type-able, see here: Make a DIV look like an input
不，您要做的是<input>用<div>. 您可以使<div>类型可以，请参阅此处：使 DIV 看起来像输入
You may then add whatever contents and classes you like that a <div>could normally take. You'll have to get a bit clever if you need the links to render themselves as a user types, for example, but still possible by binding a function to the <div>that is called when the content changes.
然后，您可以添加您喜欢的<div>通常可以使用的任何内容和类。例如，如果您需要将链接呈现为用户类型，则您必须变得有点聪明，但仍然可以通过将函数绑定到<div>内容更改时调用的 。
Twitter's tweet input box is actually a <div>, which is how it does stuff like highlight text over 140 characters.
Twitter 的推文输入框实际上是一个<div>，这就是它如何突出显示超过 140 个字符的文本。
回答by pebkac
I would suggest doing it as html within the form and style it with css to look like a text field if that is what your going for. This way it would match the layout of the form and provide the text "with links" that you need. The following code may need a few tweaks.
我建议将其作为表单中的 html 进行处理，并使用 css 对其进行样式设置，使其看起来像一个文本字段，如果这是您想要的。这样，它将匹配表单的布局并提供您需要的“带链接”的文本。以下代码可能需要一些调整。
<style type="text/css">
p.input{
width:250px;
font-size:12px;
background:#fff;
border-color:#999;
border-width:1px;
border-style:solid;
padding:3px;
}
p.input a{
color:#000;
}
</style>
<p class="input">Please <a href="/login">Login</a> or <a href="/register">Register</a> to view your tracking link.</p>
回答by albusshin
No it is not possible.
不，这是不可能的。
You can set the value of the inputtag to some kind of a link, but it would not work as a hyperlink. The only way for the user to access that URL is to copy it and then paste it to the URL bar.
您可以将input标记的值设置为某种链接，但它不能用作超链接。用户访问该 URL 的唯一方法是复制它，然后将其粘贴到 URL 栏。
What you should do is to put an <a>tag after this inputtag, which is what the most sites are doing.
你应该做的是<a>在这个标签之后加上一个标签input，这也是大多数网站所做的。
回答by Pinal
No, inside input you can't use any tags. You can change input roleor appearance, but it's a bad way.
不，在输入中你不能使用任何标签。您可以更改输入role或appearance，但这是一种糟糕的方式。
回答by Anders Rapp
You could add a function call when clicking on it:
你可以在点击它时添加一个函数调用：
<input type="text" onclick="navigate()" value="my-value" />
...
function navigate(){
window.open("my-url",'_blank');
}
回答by Satyam shekhar
yes, we can do it using " on click"
是的，我们可以使用“点击”来完成
below is the code:-
以下是代码：-
<input type="button" onclick="window.location.href = '#';" value="log in"/>
