在按钮上单击从输入框中使用抓取的查询字符串重定向到URL

Question

我有一个输入框和一个按钮。当用户输入搜索关键字时，我希望在点击按钮时抓取该关键字，并且还指向URL +关键字，并将关键字附加到网址作为查询字符串，如http://mysite.com/events.aspx?kwd=dance

我如何在javascript或jquery中执行此操作？

<input name="keyword" class="EventSearchBox" type="text" />
<input name="SearchButton" type="button" value="Search" /><br/><br/>

Answer 1

您最好将HTML转换为form，其action属性指向http://mysite.com/events.aspx，其method属性指向get。< / p>

然后，您应将keyword输入框重命名为kwd。然后你就不需要使用任何JavaScript来使它工作了。

但是，如果出于某种原因这是不可能的......

的jQuery

var keywordInput = $('input[name="keyword"]');
$('input[name="SearchButton"]').click(function() {
   window.location = 'http://mysite.com/events.aspx?kwd=' + encodeURIComponent(keywordInput.val());
});

没有jQuery

var keywordInput = document.getElementsByTagName('keyword')[0];
document.getElementsByTagName('SearchButton')[0].addEventListener('click', function() {
  window.location = 'http://mysite.com/events.aspx?kwd=' + encodeURIComponent(keywordInput.value);
}, false);

请记住＆lt; IE9不支持addEventListener()。您需要使用attachEvent()。