将表单输入值作为路径附加到操作 url
Posted
技术标签:
【中文标题】将表单输入值作为路径附加到操作 url【英文标题】:Appending form input value to action url as path 【发布时间】:2016-03-11 17:57:29 【问题描述】:我有一个这样的表格:
<form action="http://localhost/test">
<input type="text" name="keywords">
<input type="submit" value="Search">
</form>
如果我在文本输入字段中输入一个值,假设:'hello' 并提交表单,则 URL 看起来像:http://localhost/test/?keywords=hello
。
我希望将值附加到操作路径。所以基本上,在表单提交之后,URL 应该是这样的:
http://localhost/test/hello
【问题讨论】:
您可能必须使用 htaccess rewriterule! 【参考方案1】:您可以使用onsubmit
属性并在函数中设置动作,例如:
<form id="your_form" onsubmit="yourFunction()">
<input type="text" name="keywords">
<input type="submit" value="Search">
</form>
function yourFunction()
var action_src = "http://localhost/test/" + document.getElementsByName("keywords")[0].value;
var your_form = document.getElementById('your_form');
your_form.action = action_src ;
【讨论】:
【参考方案2】:您可以使用onsubmit
和jQuery
获得相同的结果。
检查以下内容。
html 代码:
<form id = "your_form" onsubmit="yourFunction()">
<input type="text" name="keywords">
<input type="submit" value="Search">
</form>
jQuery 代码:
function yourFunction()
var action_src = $("keywords").val();
var your_form = $('your_form').val();
var urlLink = "http://localhost/test/";
urlLink = urlLink + action_src;
your_form.action = urlLink;
【讨论】:
以上是关于将表单输入值作为路径附加到操作 url的主要内容,如果未能解决你的问题,请参考以下文章
Angular 2新表单,提交重定向到同一页面,表单字段附加在URL中作为查询参数,新路由器版本