Question

我有这个搜索栏：

<div id="tfheader">
    <form id="tfnewsearch" method="get" action="http://mywebsite.com">
            <input type="text" class="tftextinput" name="q" size="21" maxlength="120"><input type="submit" value="search" class="tfbutton">
    </form>
<div class="tfclear"></div>
</div>

效果很好但是当我搜索＆＃34;关键字＆＃34;时，它会重定向到 http://mywebsite.com/?q=keyword。

如何重定向到 http://mywebsite.com/keyword ？非常感谢你！

Answer 1

你可以用javascript

来做

<script>
var a = document.getElementById('tfnewsearch');
a.addEventListener('submit',function(e) {
e.preventDefault();
var b = document.getElementById('tftextinput').value;
window.location.href = 'http://mywebsite.com/'+b;

});

</script>

并为您的输入字段指定一个名为tftextinput的ID。

<input type="text" class="tftextinput" id="tftextinput" name="q" size="21" maxlength="120">

我真的不明白你为什么要这样做，因为处理这个请求服务器端更加困难，因为它只是处理你在做标准表格时会收到的$ _GET数据传输。

编辑：

以下是完整代码：

<div id="tfheader">
    <form id="tfnewsearch" method="get" action="http://www.mywebsite.com">
        <input type="text" class="tftextinput" id="tftextinput" name="q" size="21" maxlength="120"><input type="submit" value="search" class="tfbutton">
    </form>
<div class="tfclear"></div>
</div>

<script>
    var a = document.getElementById('tfnewsearch');
    a.addEventListener('submit',function(e) {
        e.preventDefault();
        var b = document.getElementById('tftextinput').value;
        window.location.href = 'http://mywebsite.com/'+b;

    });

</script>

HTML：如何创建搜索栏？

1 个答案: