Question

我在一个页面上有一个帖子列表，页面顶部有一个搜索栏。有没有办法在用户点击进入时获取搜索栏的内容？

我不想提交表单，但我想在不离开页面的情况下获取搜索栏的内容。我想我可以使用$("#txt_name").attr('value');来获取该字段的内容，但有一种方法可以在用户点击进入搜索框内时获取该值吗？

然后根据他们搜索的内容，我可以检查<div> ID并查看它们是否匹配。如果它们不匹配则将它们淡出......

Answer 1

您可以将事件处理函数附加到输入元素

var $search = $("#txt_name").on('keyup', function (e) {
  if (e.keyCode == 13) {
    alert($search.val());
  }
})

Answer 2

这样的事情应该会有所帮助：

http://jsfiddle.net/Batfan/vWMXm/

这将侦听在输入字段上按下的[enter]键，并根据它们是否包含与查询匹配的文本来隐藏/显示元素。所有结果都显示在空白搜索中。 见下文：

$(document).on("keypress","#searchbox",function(e){
    var userVal = $(this).val();
    if(e.which == 13) {
      $( "li" ).each(function() {
          if($(this).text().match(new RegExp(userVal, "i"))) {
              $(this).show();
          } else if(userVal == "") {
               $(this).show();   
          } else {
               $(this).hide();   
          }
       });
    }
    e.stopPropagation();
});

优雅的jquery搜索栏？

2 个答案: