改變輸入級

Question

我需要的jQuery腳本wiil添加類，當我輸入類型=「text」是積極的，當它不remeve新添加的類（回默認值）

$("#search_text").click(function() { 
    $(this).removeClass('search').addClass('search_active'); 
    $('#search_icon').removeClass('search_icon').addClass('search_icon_active'); 
}); 

現在這個腳本只添加新類，但是當光標（輸入）不活動時，它不會回到默認值。搜索

Answer 1

正如丹尼爾A.懷特說，你應該使用.focus和.blur

$("#search_text").focus(function() { 
    $(this).removeClass('search').addClass('search_active'); 
    $('#search_icon').removeClass('search_icon').addClass('search_icon_active'); 
}); 

$("#search_text").blur(function() { 
    $(this).removeClass('search_active').addClass('search'); 
    $('#search_icon').removeClass('search_icon_active').addClass('search_icon'); 
}); 

欲瞭解更多信息： 焦點：http://api.jquery.com/focus/ 模糊：http://api.jquery.com/blur/

Answer 2

看看.focus和.blur jquery事件。

Answer 3

如果你不介意不包括IE 6和7你可以使用：focus CSS事件。

input { background-color: #F7F7F7; }

input:focus { background-color: #FFFFFF; }