jquery 如何从搜索框中获取字符串

Question

我正在研究jquery搜索框。

我在从 html 获取字符串 var 时遇到了麻烦。

在我的 html 文件中。

我有..

<header>
  <div id="searchBox">
    <form name="searchForm">
      <div>
        <i class="icon-search icon-large icon-height"></i>
        <input name="searchfield" type="search" size="20" maxlength="30">
      </div>
    </form>
  </div>
</header>

和

在我的 jquery 文件中

$(".icon-search").click(function() {
  var searchstring  = $(this).text('#searchfield');// $('#searchfield');
  searchstring.focus();
  //$('#searchBox').html($('input:searchfield').val());
  alert("searchfield.  " + searchstring +  " hahah");
});

当我点击搜索一些字符串时。

它显示的是Object对象而不是一些字符串。

我不太确定如何将对象转换为字符串。

有人知道如何转换吗？

Answer 1

这行代码没有任何意义:

var searchstring  = $(this).text('#searchfield');// $('#searchfield');

确实应该是:

var searchstring = $('#searchfield');

然后你就可以做到:

searchstring.focus();

并使用 .val() 检索文本:

alert("searchfield.  " + searchstring.val() +  " hahah");

.text() 获取或设置 HTML 元素的文本内容。如果在没有任何参数的情况下调用它，它获取一个值；如果向它传递一个值，它设置一个值。因此 $(this).text('#searchfield') 将设置 $(this) 的内部文本(您的 .icon-search ) 到字符串 "#searchfield"。

现在，表单元素没有内部文本，它有一个值，因此 .val()，否则其工作方式与 .text()

alert(myTextbox.val()); // get value
myTextbox.val('test');  // set value

编辑:

此外，$('#searchfield') 查找 ID“searchfield”的元素。您应该将 id="searchfield" 添加到文本字段，或者将脚本更新为

var searchstring = $('input[name=searchfield]');