我有这个搜索栏:
<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>
效果很好,但是当我搜索“关键字”时,它会重定向到 http://mywebsite.com/?q=keyword .
如何重定向到 http://mywebsite.com/keyword ?非常感谢!
最佳答案
你可以用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>
关于javascript - HTML:如何创建搜索栏?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27580420/