1

我有一个网站，我希望人们能够在文本框中输入内容并根据他们输入的内容发送到该目录。

说客户编号，所以我们有客户＃155。他的发票在文件夹/invoices/155目录中。我希望他能够输入他的客户 # 并通过单击按钮定向到包含他所有发票的目录。

现在我已经编写了以下代码，但它仅在我用鼠标单击按钮时才有效。在 Internet Explorer 中，当我按下回车键时，它在地址栏中给了我一堆 gook，但什么也没做。在地址栏中看起来像这样：

file:///C:/Users/My%20Name/Desktop/test.html?dir=%2Finvoices%2F&userinput=155

而不是加载文件夹/invoices/155/。

<html>
<head>
<title>test</title>
</head>
<form name="goto" action="">
<input name="dir" type="hidden" value="/invoices/">
<input name="userinput" type="text"> <input type="button" value="try me" onclick="window.location=this.form.dir.value+userinput.value">

</form>

谁能告诉我代码有什么问题以及我能做些什么来修复它？提前致谢。

4

3 回答 3

2

在某些浏览器中，即使没有提交按钮，当您按下回车时表单也会被发布。使用提交按钮，并抓住提交，然后你处理所有情况：

<form name="goto" action="" onsubmit="window.location=this.dir.value+this.userinput.value;return false;">
<input name="dir" type="hidden" value="/invoices/">
<input name="userinput" type="text"> <input type="submit" value="try me">
</form>
于 2012-12-07T22:42:41.720 回答
0

如果您使用文件协议，它将无法正常工作。尤其是在 IE 中。你需要一个真正的网络服务器。

让客户输入他的身份证是非常 不安全的。任何人都可以输入任何 id。使用登录。

清理每个用户输入以防止滥用是非常重要的。

这是一条很长的路要走。

于 2012-12-07T22:40:36.777 回答
0

我认为你应该onsubmit继续<form>

<!DOCTYPE html>
<html>
<head>
    <title>test</title>
    <script>
        function handleFormSubmit(form)
        {
            window.location = form.dir.value + form.userinput.value;
            return false;
        }
    </script>
</head>
<body>
    <form onsubmit="return handleFormSubmit(this)">
            <input name="dir" type="hidden" value="/invoices/">
            <input name="userinput" type="text">
            <input type="submit" value="try me" >    
    </form>
</body>
</html>​​​​​​​

顺便说一句：
内联 javascript 不是很好。使用脚本标签或外部 .js 文件。

编辑：
哎呀！好的，错误是我写的this.form.dir，但它必须是this.dir因为this已经引用了表单，现在 javascript 处理程序位于form标记 ( onsubmit="<handler-code>") 上。这有效 - http://jsfiddle.net/Q875a/

编辑2：
内联javascript意味着您在属性中的html标签（，，...form）input中编写javascript代码-它不可读。将您的脚本放在处理函数（即）内的标记中使其更具可读性，特别是如果您的站点在其中包含越来越多的脚本 - 请参阅当前脚本和-attribute。onXXX scripthandleFormSubmitonsubmit

最后，如果你想更进一步跨浏览器、强大的 javascript 开发，你应该看看jQuery——它是真正专业和退出 javascript 编程的大门！

JSFiddle 测试：http:
//jsfiddle.net/yNTK5/

有关该主题的 jQuery 链接：http: //api.jquery.com/submit/
http://api.jquery.com/on/
http://api.jquery.com/ready/

于 2012-12-07T22:41:15.210 回答