| 标题 | HTML5inputplaceholder属性如何完美兼任ie |
| 内容 | 记得引用jquery类库 代码如下: $(document).ready(function(){ if($.browser.msie) $("input:text,input:password").each(function(){ var$placeholder=$(this).attr("placeholder"); var$width=$(this).css("width"); var$id=$(this).attr("id"); var$height=parseInt($(this).css("height"))+6+"px"; var$fontSize=$(this).css("font-size"); var$fontWeight=$(this).css("font-weight"); var$lineHeight=$height; if($(this).css("line-height")!="normal"){ $lineHeight=parseInt($(this).css("line-height"))+6+"px"; } if($placeholder!=undefined){ $(this).after("<spanclass=\"placeholderph_"+$id+"\"style=\"width:"+$width+";line-height:"+$lineHeight+";height:"+$height+";font-weight:"+$fontWeight+";margin-left:-"+$width+";font-size:"+$fontSize+"\">"+$placeholder+"</span>"); } $(this).bind("keyup",function(){ if($(this).val()==""){ $(this).parent().find(".ph_"+$id).css("display","inline-block"); } else{ $(this).parent().find(".ph_"+$id).css("display","none"); } }); }); $(".placeholder").live("click",function(){ $(this).prev().focus(); }); }); 页面调用 代码如下: <inputid="n1"type="text"placeholder="我是提示内容正常"/> <inputid="n2"type="text"placeholder="我是提示内容宽高"style="width:100px;height:100px;"/> <inputid="n3"type="text"placeholder="我是提示内容我有其他样式"/style="width:300px;height:40px;font-weight:bold;"> <inputid="n4"type="text"placeholder="还可以尝试下其他的"/> 样式 代码如下: <styletype="text/css"> .placeholder{display:inline-block;color:gray;vertical-align:top;overflow:hidden;} </style> |
| 随便看 |
|
在线学习网考试资料包含高考、自考、专升本考试、人事考试、公务员考试、大学生村官考试、特岗教师招聘考试、事业单位招聘考试、企业人才招聘、银行招聘、教师招聘、农村信用社招聘、各类资格证书考试等各类考试资料。