js面向对象

来源：互联网发布：怎样快速养淘宝小号编辑：程序博客网时间：2024/06/04 18:21
完整demo
111111111
<!DOCTYPE html><html><head><title>demo</title><meta charset="utf-8"></head><body><!-- <input type="text" id="txtRejectReason"  maxlength="100" onclick="javascript:if(this.value=='input no more than 100 chars') {this.value=''; this.style.color='#333';}" onblur="javascript:if(this.value=='') {this.value='input no more than 100 chars';this.style.color='#999';}" value="input no more than 100 chars"/> --><input type="text" id="txtRejectReason"  maxlength="100"  value="input no more than 100 chars"/><script>// obj textbox// attr :id,maskText,maskColor// event: onclick , onblurvar demaskText="please input one value";var demaskColor="#999";var MaskText = function(id,maskText,maskColor){this.obj = document.getElementById(id);this.maskText =maskText;this.maskColor =maskColor;};var events =['click','blur'];var SetEvent  = function(arr){console.log(arr);//定义一个MaskText对象数组    var masks = [];for(var i=0;i<arr.length;i++){// arr[i]  == itemmasks.push(new MaskText(arr[i].id,setTextboxAttr(arr[i].maskText,'maskText'),setTextboxAttr(arr[i].maskColor,'maskColor')));};//闭包for(let j=0;j<masks.length;j++){// masks[j]var item = masks[j];item.obj.value = item.maskText;item.obj.style.color = item.maskColor;item.obj["on" + events[0]] = function() {                if (item.obj.value == item.maskText) { item.obj.style.color = '#333'; item.obj.value = ''; }//获取焦点            }            item.obj["on" + events[1]] = function() {                 if (item.obj.value == '') { item.obj.style.color = item.maskColor; item.obj.value = item.maskText; }//失去焦点            }}}var setTextboxAttr = function(item,order){// console.log(order);switch(order){case "maskText":return (typeof item == 'undefined')?demaskText:item;break;case "maskColor":return (typeof item == 'undefined')?demaskColor:item;break;default:return "";break;}};// SetEvent([{ id: 'text1' }, { id: 'text2', maskText: 'test'}]);SetEvent([{ id: 'txtRejectReason' }]);</script></body></html>
阅读全文
0 0