需要一些JQuery或JavaScript代碼滾動到頁面搜索後使用的第一個結果包含（）

我在開發頁面搜索目錄選項卡上：http://www.vpgmarketresearch.com/tabs.html。我正在尋找一種方法將窗口滾動到從搜索中找到的第一個結果。例如，如果您搜索「西班牙」，則有109個結果。我想把用戶帶到第一個。需要一些JQuery或JavaScript代碼滾動到頁面搜索後使用的第一個結果包含（）

我讀過所有類似的問題，沒有什麼相關的。

您可以通過查看源代碼查看所有代碼。忽略這個非常大的頁面醜陋的內聯CSS。這是暫時的。

這裏是包含代碼「包含了」，我認爲這是什麼需要調整：

$('div.TabbedPanelsContent :contains("'+term+'")').each(function(){ 
$(this).html($(this).html().replace(new RegExp(term,'g'), '<span class="highlight">'+term+'</span>')); 
$(this).find('span.highlight').fadeIn("slow");

這裏就是我得到這個位的搜索代碼：http://www.ryancoughlin.com/2008/12/20/jquery-search-and-highlight/

任何幫助將不勝感激！

來源

2011-07-07 cvonnieda

我硬編碼的術語，以便替換成你自己的實現：

var term = 'Encephalitis'; 

$('div.TabbedPanelsContent :contains("'+term+'")').each(function(){ 
    $(this).html($(this).html().replace(new RegExp(term,'g'), '<span class="highlight">'+term+'</span>')); 
    $(this).find('span.highlight').fadeIn("slow"); var offset = $(this).offset().top; 
    $('html,body').animate({ 
    scrollTop: offset 
    }, 100); 
    return false; 
});

可以調整100毫秒的延遲，以長或短。返回false是非常重要的，因爲它會破壞迭代器。如果你不這樣做，那麼頁面將滾動到該詞的每個匹配項而不是第一個找到的匹配項。

來源

2011-07-07 05:11:36 Jake

謝謝傑克，效果很棒！一個奇怪的異常，我沒有得到。當我用它來搜索國家名稱時，它不會滾動，如「西班牙」或「意大利」。任何想法，爲什麼這是？ [鏈接]（http://www.vpgmarketresearch.com/tabs.html） – cvonnieda

Jake，更正...它在IE中完全不起作用。：/（和其他一切！） – cvonnieda

你可以用這樣一個涼爽的平穩過渡，做到這一點：

$("html, body").animate({ scrollTop: 0 }, "slow");

這將滾動到頁面的頂部，（0爲y-的頂部座標）

要進入第一個結果，你可以更換0：

$("html, body").animate({ scrollTop: $("#first_result").offset().top }, "slow");

或者，你可以使用scrollTo plugin。

希望這會有所幫助。乾杯

來源

2011-07-07 05:12:03

謝謝你的埃德加！ – cvonnieda

Edgar：Jake的上述版本在IE中不起作用。有什麼建議麼？謝謝！ – cvonnieda

需要一些JQuery或JavaScript代碼滾動到頁面搜索後使用的第一個結果包含（）

回答

相關問題