如何将HTML表单的值转换为“自定义"表单,网址? [英] How can I get an HTML form's values into a "custom" URL?

查看:54
本文介绍了如何将HTML表单的值转换为“自定义"表单,网址?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

在我的网站上,我可以通过以下方式访问搜索功能:"mysite.com/search/search_term",其中"search_term"是用户输入的术语.我正在尝试获得一种简单的单输入形式以这种方式设置URL格式.我可以做到的一种方法是制作一个PHP脚本,该脚本将重定向到正确的位置.因此,如果您导航到"search_redirect.php?term = search_term",它只会将您重定向到"/search/search_term".我想避免这样做,因为这似乎是多余的.如果找不到更好的答案,那可能就是我最终要做的.现在,这是我到目前为止尝试过的:

我尝试在这样的表单上设置onsubmit:

<form onsubmit="search_navigate()" id="navbar_form">
    <input type="search" placeholder="Search Articles..." id="navbar_search"></input>
    <input id="navbar_submit" type="submit" value=">"/>
</form>

...,onsubmit调用此函数:

function search_navigate(){
    alert("well hey there");
    window.location = ("http://www.google.com");
}

当我单击提交"按钮时,我可以看到警报,但没有像您期望的那样将我带到Google,而是带我到了我所在的同一页面(无论该页面可能在什么地方). /p>

这是我以这种方式实现它时遇到的问题.如果您完全有另一种方法,我还是想听听.

解决方案

function search_navigate() {
    var obj = document.getElementById("navbar_search");
    var keyword = obj.value;
    var dst = "http://yoursite.com/search/" + keyword;
    window.location = dst;
}

这对您有用吗?


此外,要停止表单提交其原始功能,请在函数调用后附加"return false",即onsubmit ="foo(); return false".

On my site, I can access a search function by going to "mysite.com/search/search_term", where "search_term" is the term the user entered. I'm trying to get a simple one-input form to format the URL that way. One way that I can do it is make a PHP script that would redirect to the proper place. So if you navigate to "search_redirect.php?term=search_term", it would just redirect you to "/search/search_term". I want to avoid doing this, as it seems kind of redundant. If I don't find a better answer, that's probably what I'll end up doing. Now, here's what I tried so far:

I tried setting an onsubmit on the form like this:

<form onsubmit="search_navigate()" id="navbar_form">
    <input type="search" placeholder="Search Articles..." id="navbar_search"></input>
    <input id="navbar_submit" type="submit" value=">"/>
</form>

... which, onsubmit calls this function:

function search_navigate(){
    alert("well hey there");
    window.location = ("http://www.google.com");
}

When I click on the submit button, I can see the alert, but instead of taking me to Google as you'd expect, it takes me to the same page I'm on (whatever that page might be).

This is the problem I'm faced with when implementing it this way. If you have another way entirely, I'd still like to hear it.

解决方案

function search_navigate() {
    var obj = document.getElementById("navbar_search");
    var keyword = obj.value;
    var dst = "http://yoursite.com/search/" + keyword;
    window.location = dst;
}

may this work for you?


further more, to stop the form submit doing its origin function, append "return false" to the function call, that is, onsubmit="foo();return false".

这篇关于如何将HTML表单的值转换为“自定义"表单,网址?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆