在IE8及以下的瀏覽器中,不支持placeholder屬性的解決辦法


以下代碼解決了在IE8及以下瀏覽器中不支持placeholder屬性。

原理:將placeholder的值作為內容寫入控件,並添加控件事件來進行模擬。

;(function(){
    if( !('placeholder' in document.createElement('input')) ){
        // 匹配 除type=password以外所有input、textarea
        $('input[placeholder][type!=password],textarea[placeholder]').each(function(){   
            var self = $(this),   
            text= self.attr('placeholder');
            // 如果內容為空,則寫入
            if(self.val()===""){ 
                self.val(text).addClass('placeholder');
            }

            // 控件激活,清空placeholder
            self.focus(function(){
                if(self.val()===text){
                    self.val("").removeClass('placeholder');
                }
            // 控件失去焦點,清空placeholder
            }).blur(function(){
                if(self.val()===""){
                    self.val(text).addClass('placeholder');
                }
            });            
        });   
    }
})();

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM