jquery搜索框，點擊鏈接預搜索字段將不會工作

如果鍵入橙色或蘋果在搜索框中，你看到它隱藏了一個事實並非如此。

完美的作品。

我所試圖做的是，如果我點擊例如橙色，我希望它來填充搜索框，然後做它時，你自然鍵入橙色..

眼下點擊橙色將填充搜索框，但它不會使jQuery的工作。

任何想法或幫助？

HTML

Search: <input id = "searchbox" type = "text"/><br/> 

<div class="track"> 
<h1>Section 1</h1> 
<h3><a style="cursor:pointer;" onclick="document.getElementById('searchbox').value='orange';">orange</a></h3> 
</div> 

<div class="track"> 
<h1>section 2</h1> 
<h3><a style="cursor:pointer;" onclick="document.getElementById('searchbox').value='apple';">apple</a></h3> 
</div>

JQUERY

$("#searchbox").on("keydown keyup keypress change", function() { 
var query = this.value.toLowerCase(); 
$(".track").each(function() { 
    var cur = $(this); 
    if(cur.text().toLowerCase().indexOf(query) == -1) { 
     cur.hide("fast"); 
    } 
    else { 
     cur.show("fast"); 
    } 
});

}）;

來源

2012-11-05 Jennifer Smith

我個人真的不明白這裏的目標是什麼。如果您向我們提供有關您想要完成的更多細節，我們可能會更好地幫助您。 –

目標很簡單：我試圖做到這一點，如果你點擊橙色，它會用橙色填充搜索框字段，但是當它填滿搜索框字段時，它並不會真正執行jquery腳本我在頁面 –

那裏，如果你手動輸入單詞orange，進入搜索框，你可以看到jquery腳本工作（它隱藏了不包含你輸入的關鍵字的.track div） –

當onclick事件被觸發時，您不執行搜索邏輯。您只將值分配給搜索輸入字段。改變你的腳本到這個：

function search(query){ 
    $(".track").each(function() { 
     var cur = $(this); 
     if(cur.text().toLowerCase().indexOf(query.toLowerCase()) == -1) { 
      cur.hide("fast"); 
     } 
     else { 
      cur.show("fast"); 
     } 
    }); 
}   

$("#searchbox").on("keydown keyup keypress change", function() { 
    search($(this).val()); 
}); 

$(".track h3 a").on("click", function() { 
    search($("#searchbox").val()); 
});

來源

2012-11-06 08:14:19 jwaliszko

你是男人！謝謝！我有點生疏，知道我必須做的事情！謝謝！ –

jquery搜索框，點擊鏈接預搜索字段將不會工作

回答

相關問題