Question

我在智能手机应用中创建了搜索页面，搜索应该在应用中搜索匹配项。当我对搜索词进行硬编码时，jquery选择器工作正常，当我用一个变量替换硬编码选择器时，它返回＆＃34; undefined＆＃34;。我必须错过一些令人目眩的明显但我几个小时后才能看到的东西。

以下是带有输入字段

的搜索页面

<input name="searchTxt" type="text" maxlength="32" id="searchTxt" class="searchField"/>
<button onclick="searchApp()"> Search </button>
<p id="searchResultsP">Search results go here</p>

以下是应该搜索应用并覆盖＆＃34; searchResultsP＆＃34;的js。以上段落与搜索结果。我添加了一些提醒，试图找出它失败的位置，并在下方添加评论以显示结果。

function searchApp() {
    var $searchTerm = "";
$searchTerm =  document.getElementById("searchTxt").value;
alert ("$searchTerm is " + $searchTerm); // this works correctly
alert("search 1 results " + $( ".english:contains($searchTerm)" ).html());// returns undefined
alert("search 2 results hard coded " + $( ".english:contains('arrest')" ).html()); // this works correctly
var $searchResultsAlert = $( ".english:contains('arrest')" ).html();
alert ("search 3 results hard coded are " + $searchResultsAlert);// this works correctly

// Now overwrite the searchresultsP
    document.getElementById("searchResultsP").innerHTML = $( ".english:contains('arrest')" ).value; // this returns undefined

Answer 1

表达式

 alert("search 1 results " + $( ".english:contains($searchTerm)" ).html());

正在搜索＆＃34; $ searchTerm＆＃34;字面上但不是变量值$searchTerm。

更改为

 alert("search 1 results " + $( ".english:contains(" + $searchTerm + ")" ).html());

Answer 2

没关系，我明白了。不完全确定为什么，但声明：

document.getElementById("searchResultsP").innerHTML = $( ".english:contains(" + $searchTerm + ")" ).html();

在段落中插入了一堆js代码。决议是分两步完成，首先在变量中获取搜索结果，然后在段落中插入变量，如下所示

var $searchResultsAlert = $( ".english:contains(" + $searchTerm + ")" ).html();
document.getElementById("searchResultsP").innerHTML = $searchResultsAlert

再次感谢您的时间。

使用输入字段作为jquery选择器

2 个答案: