如何用回车触发我的输入类型=按钮？答案

【问题标题】：How to trigger my input type=button with enter?如何用回车触发我的输入类型=按钮？
【发布时间】：2015-01-09 16:26:25
【问题描述】：

我正在使用我找到的这个表格：

<FORM METHOD="POST" ENCTYPE="x-www-form-urlencoded">
    <input type="text" id="Password"/>
    <input type="button" id="Access" onclick="document.location=Password.value" VALUE="Accès"/>
</FORM>

它适用于我想做的事情，但我也想允许通过按 enter 来触发命令。我已经阅读了使用 submit 类型的解决方案，并且还添加了解决方案

onkeydown="if (event.keyCode == 13) document.getElementById('Access').click()" 在文本输入中。

两者都不起作用，所以我不知道我是否在滥用它们，或者我的document.location=Password.value 是否不能以这种方式使用。如果是这样，您能否告诉我在不使用 php 或 js 文件的情况下替换它的最简单解决方案，因为我不太明白。这个网站不会公开，所以我并不真正关心安全性或它是否不是正确的做法。

编辑：考虑到你给我的答案没有完全起作用（jlbruno 的答案在输入或点击时都不起作用，riad 的答案只能在点击时起作用），这是我的页面的完整代码以及 riad 的解决方案，请告诉如果有什么可能干扰我

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
	<head>
		<title>JVPW Cloud - Le Nuage de la JVPW !</title>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
		<link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />
		<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
	</head>
	<body>
    <p><center><img src="logo.png" width="1000" height="400" /></center></p>
    <p><span style="font-family:Verdana"><b>Tout l'univers de la JVPW pour seulement 9.99 $</b></span></p>

    <h1>Bienvenue</h1>
    <p>Si vous disposez d'un early access gratuit, entrez le code ci-dessous et appuyez sur Accès (pas Entrée !)</p>

    <FORM METHOD="POST" ENCTYPE="x-www-form-urlencoded">
    <input type="text" id="Password" onkeydown="if (event.keyCode == 13) document.getElementById('Access').click()" />
    <input type="button" id="Access" onclick="window.location=document.getElementById('Password').value ;" VALUE="Accès"/>
    </FORM>
    </body>
    </html>

【问题讨论】：

Password.value ?这将如何运作？
嗨，我正在使用文本输入来重定向，当单击按钮时，mywebsite.com/valueofthetext/ 上的用户 :) 我不知道它是否应该工作，但它确实
您更新的代码示例在这里似乎也可以正常工作。您可以在这里创建一个不起作用的 sn-p，或者在 js fiddle 上创建一个吗？ + @Riad
是的。但不在我的网站上。我猜我的服务器以某种方式阻止它工作，这是我能想到的唯一解决方案。
@jlbruno：“在这里似乎也可以正常工作” ...那为什么要重现错误？ Krys3000 不了解 JS 是如何工作的。 Krys3000 ：输入完整的网站 url 而不是 password.value 或尝试使用有效的 URL。你不能在 / 应用程序中看到错误吗...？

标签： html button input enter

【解决方案1】：

我不建议使用内联事件处理程序，但这表示我将继续这样做作为示例。

您应该将按钮更改为提交按钮，并将当前的 onclick 移动到表单上的 onsubmit。

    <FORM METHOD="POST" ENCTYPE="x-www-form-urlencoded" onsubmit="document.location=Password.value">
        <input type="text" id="Password"/>
        <input type="submit" id="Access" VALUE="Accès"/>
    </FORM>

【讨论】：

谢谢，但由于某种原因，它不起作用。我应该在某处添加其他东西以使其正常工作吗？
我已经在上面对其进行了编辑以使其成为代码 sn-p，因此，如果您运行它，请在输入字段中输入一些文本并按 Enter，它似乎可以工作...它重定向到字段中输入了什么。
是的。但是当我把它放在我的网站上并上传时，它不起作用。单击也不再适用于您的代码。文本字段只是变成空白，没有任何反应:(
现在我很困惑。如果它在这里有效，但在您的网站上无效，那么您没有向我们提供我们需要的所有信息。
我的代码“点击不再起作用”是什么意思？当你点击上面的“运行代码sn-p”时？

【解决方案2】：

你可以试试这个。

<FORM METHOD="POST" ENCTYPE="x-www-form-urlencoded">
 <input type="text" id="Password" onkeydown="if (event.keyCode == 13) document.getElementById('Access').click()" />
 <input type="button" id="Access" onclick="doSubmitWork();" VALUE="Accès"/>
</FORM>

<script type="text/javascript">
    function doSubmitWork(){
        window.location = 'mywebsite.com/'+document.getElementById('Password').value ;
    }
</script>

JS FIDDLE DEMO

【讨论】：

谢谢，但您的解决方案在单击按钮时有效，但仍按 Enter 不会执行任何操作
你在 js fiddle 上看到了吗？我看到它有效...当您填写文本框并点击 enter 键时。
很抱歉，这是我第一次使用这个小提琴，但我试图在结果字段中输入一些内容并按 Enter 键，结果 403'd
是的..应该是因为没有mywebsite.com 对吧？你可以把google.com放在window.location = '' value
确实它似乎在小提琴上工作，但是当我把你的代码放在我的网站上时，只有点击有效。 Enter 使该字段变为空白，并且没有任何反应。

【解决方案3】：

我做了以下事情，它对我有用。希望对你有帮助。

<form name="frm" method="post">
    <input type="password" name="psw">
    <input type="submit" value="Enter">
</form>

【讨论】：

对不起，我是初学者。我不太明白我应该怎么做。您是否建议我将“按钮”替换为“提交”？它不工作。
@JR 是否重定向到密码字段值的值？
您可以将“提交”放在按钮上，当您按下回车键时它会自动工作...
解决方法如下我1分钟前测试过：