JQuery全局占位符替换

JQuery global Placeholder replacement

本文关键字:替换 占位符 全局 JQuery      更新时间:2023-09-26

由于我对一些浏览器不支持"占位符"-标签这一事实不满意,我想:"当JS大部分可用时,为什么不开发一个JS- workaround "

所以我建立了一个表单输入搜索,使所有占位符的行为在JS中有一个优势:onFocus将清除字段!占位符不清除onFocus字段的事实是这样做的另一个原因。这是代码,你可以随意使用和修改

$('form').each(function(){
                var f = $(this);
                f.find('input[type=text]').each(function(){
                    var s = $(this);
                    var attr = s.attr('placeholder'); 
                    if (attr && $.trim(attr)!='') {
                        $.extend(this,{oldPlaceholder: s.attr('placeholder')})
                        s.removeAttr('placeholder');
                        if ($.trim(this.value)=='') {
                            this.value = this.oldPlaceholder;
                        }

                        s.focus(function(){
                            if ($.trim(s.val())==this.oldPlaceholder) {
                                s.val('');
                            }
                        });
                        s.blur(function(){
                            if ($.trim(s.val())=='') {
                                s.val(this.oldPlaceholder);
                            }
                        });
                    }
                });
                f.submit(function(){
                    $(this).find('input[type=text]').each(function(){
                        if (this.oldPlaceholder && $.trim(this.value)==this.oldPlaceholder) {
                            this.value = '';
                        }
                    });
                });
            });