JavaScript：一个面向对象的例子_前端js面向对象事例-优快云博客

本文详细介绍了如何使用JavaScript实现组件关键词提示效果和数字验证功能，包括初始化属性、焦点事件处理和输入框失焦事件处理，确保用户体验与数据准确性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

定义对象的一种方式：

//组件关键词提示效果 april 2014-6-11
var modulePrompt={
	js_data:function(module_id,msg){  //初始化属性  module_id:组件ID,msg:提示内容
		this.msg=msg;
		this.module_id=module_id;
	    return this;
	},
	moduleFocus:function(){
		var _self = this;
		$('#'+_self.module_id).focus(function () {
		    if($(this).val()==_self.msg){
		        $(this).val("");  
		    }
		});
		return _self;
	},
	moduleBlur:function(){
		var _self = this;
		$('#'+_self.module_id).blur(function () {
		    if($(this).val()==""){
		        $(this).val(_self.msg);
		    }
		});
		return _self;
	}
}
//调用
modulePrompt.js_data('testModule','请输入关键词').moduleFocus().moduleBlur();
//<textarea id="testModule">请输入关键词</textarea>

//数字验证
var digitCheck={
	js_data:function(module_id){
		this.id=module_id;
		this.preValue=0;
		this.reg=/^\+?(1)?[1-9]?[0-9](\.5)?$/ ;//只允许0.5小数的三位数赋分
	    return this;
	},
	moduleFocus:function(){
		var _self=this;
		$('#'+_self.id).focus(function(){
			_self.preValue=$(this).val();
			$(this).select();
		})
		return _self;
	},
	moduleBlur:function(){
		var _self=this;
		$('#'+_self.id).blur(function(){
			var nowValue=$(this).val();
			if(!_self.reg.test(nowValue)){
				$(this).val(_self.preValue);
			}else{
				//do other things
			}
		})
		return _self;
	}
}
// onkeyup="this.value = this.value.replace(/\D/g,'')"
//<input id="test_id" type="text" value="0" maxlength="3" onfocus="clearValue(this);return false" onblur="editScore(this)"/>