jquery - 在按钮上单击重定向到 url，并从输入框中抓取查询字符串

Question

我有一个输入框和一个按钮。当用户输入搜索关键字时，我想在单击按钮时获取该关键字，并直接转到 URL+ 关键字，将关键字作为查询字符串附加到 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。

然后您应该将您的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);

请记住， addEventListener()。您需要使用 attachEvent()。