Question

我已经无休止地用Google搜索了大约一个小时，所以如果之前有人问过，请原谅我。

我使用纯Javascript而不想使用jQuery。

PREAMBLE

我有一个带有3个选择框的HTML表单，用于控制项目的搜索。更新一个时，一个简单的函数会读取选择框中的每个值，并生成一个与我们的URL重写标准相匹配的URL。

http://www.example.com/search/select1/data1/select2/data2/select3/data3/

然后在

中使用

history.pushState

更新浏览器的网址，以便用户可以立即为该网页添加书签。这很好。

问题

当用户按下表单的按钮时，我想要的是读取所有选择框值的功能，像以前一样生成URL，但也加载此特定URL，以便底层数据库代码可以返回该结果在页面上搜索。

然而，当我使用

时

window.location.href

它加载页面，但也从表单提交中发送查询字符串。这会破坏数据库代码，因为它实际上是两次获取所有数据。

示例

我从select1选择'A'，从select2选择'D'，从select3选择'E'。

结果：

http://www.example.com/search/select1/A/select2/D/select3/E/?select1=A&select2=D&select3=E

SO ...

是否可以以正确的重写格式生成URL，然后加载没有查询字符串的页面？

JAVASCRIPT

 function changepage(loadpage)
    {
        var theform
        theform = document.getElementById("searchform");

        var pageurl

        pageurl = 'http://www.example.com/search/'

        var select1 = theform.select1.value;
        var select2 = theform.select2.value;
        var select3 = theform.select3.value; 

        if(select1 != '')
        {
            pageurl = pageurl + 'select1/' + select1 + '/';
        }

        if(select2 != '')
        {
            pageurl = pageurl + 'select2/' + select2 + '/';
        }

        if(select3 != '')
        {
            pageurl = pageurl + 'select3/' + select3 + '/';
        }

        history.pushState('data', '', pageurl);

        if(loadpage=='yes')
        {
        window.location.href = pageurl;
        }
    }

HTML

<form method="post" action="form.asp">
    <select id="select1"><option>A</option><option>B</option></select>
    <select id="select2"><option>C</option><option>D</option></select>
    <select id="select3"><option>E</option><option>F</option></select>
    <button onClick="changepage('yes');">
</form>

Javascript window.location重定向与url重写，没有查询字符串

0 个答案: