將輸入值與範圍內的文本進行匹配

Question

我可以將輸入值與範圍匹配;然而，我只是要檢索我比較的列表中的第一個跨度。我需要比較兩個列表項目。如果輸入等於任一列表項，則它應該是真實的。我只獲得第一個值的匹配。

HTML

<input id="search" type="text" class="input"> 
<ul>              <li id="111" class="active" style="display: list-item;"><a href="" onclick="return false;"><span style="display:none">111</span><span style="display: inline;">1-1-1</span></a></li> 
<li id="222" style="display: list-item;"><a href="" onclick="return false;"><span style="display:none">222</span><span style="display: inline;">2-2-2</span></a></li> 
</ul> 

JS

$('#search').on('input',function(){   

    if($('#search').val() != $('ul li a span:eq(0)').text()){ 
     return console.log('false') 
    } 
    else if($('#search').val() == $('ul li a span:eq(0)').text()) { return console.log ('true') } 

}); 

jsfiddle

Answer 1

我認爲，當你的元素列表上稱之爲.text()它將返回的第一個元素的文本。所以你需要遍歷你感興趣的跨度並檢查每個跨度。

下面是一個例子：

$('#search').on('input',function(){ 
    var found = false; 
    $('ul li a span:first-child').each(function (i, el){ 
    if ($(el).text() == $('#search').val()) { 
     found = true; 
     return; 
    } 
    }) 
    console.log(found); 
}); 

Answer 2

或者，你可以剪掉所有的HTML標籤用正則表達式和搜索內容。

function noTags(body) { 
    var regex = /(<([^>]+)>)/ig; 
    return body.replace(regex, ""); 
}