外框醒目提示
来源：互联网 发布：python源码剖析 百度云 编辑：程序博客网 时间：2024/04/27 07:54
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <title></title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script><script type="text/javascript">(function ($) { //===================================================================== //插件名称: myunwrap //作 者: yenange //功能说明: 为元素去除父节点。jquery.1.3.2中无此函数，特此补之。 //输入参数: //调用示例: $("#id").myunwrap(); //输出参数: //创建日期: 2012-01-05 $.fn.myunwrap = function () { return this.parent().each(function () { if (!jQuery.nodeName(this, "body")) { jQuery(this).replaceWith(this.childNodes); } }).end(); } //===================================================================== //插件名称: SuperFocus //作 者: yenange //功能说明: 将元素加醒目外框，几秒后消失。用以醒目提示。 //输入参数: //调用示例: $("#id").SuperFocus(); $obj.SuperFocus("border:20px solid green",5000); //输出参数: //创建日期: 2012-01-05 $.fn.SuperFocus = function (borderStyle, milliseconds) { if (typeof (borderStyle) == "undefined" || $.trim(borderStyle) == "") { borderStyle = "border:3px solid red;"; } if (typeof (milliseconds) == "undefined") { milliseconds = 3000; } this.wrap("<div style='" + borderStyle + ";display:inline-block;'></div>"); var jqObj = this; setTimeout(function () { jqObj.myunwrap(); var obj = jqObj[0]; //下面的操作其实就是focus,但$obj.focus()在IE下似乎是无用的，so that。 if (obj.setSelectionRange) { setTimeout(function () { obj.setSelectionRange(0, 0); obj.focus(); }, 100); } else { if (obj.createTextRange) { var range = obj.createTextRange(); range.collapse(true); range.moveEnd("character", 0); range.moveStart("character", 0); range.select(); } try { setTimeout(function () { obj.focus(); }, 100); } catch (e) { } } }, milliseconds); };})(jQuery); </script> <script type="text/javascript"> function test() { $obj=$("#Text1"); if ($.trim($obj.val()) == "") { alert("此字段不得为空！"); $obj.SuperFocus(); //$obj.SuperFocus("border:20px solid green",5000); } } </script></head><body> 请输入姓名:<input id="Text1" type="text" value="" /> <input id="Button1" type="button" value="测试" onclick="test()" /></body></html>
