首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

常用JavaScript函数 47 - 58(自小弟我总结)

2012-11-10 
常用JavaScript函数 47 -58(自我总结)47. ? 打印对象48、 点击编辑:49、 防止回车错误提交50、 回车提交51、 j

常用JavaScript函数 47 - 58(自我总结)

47. ? 打印对象

48、 点击编辑:

49、 防止回车错误提交

50、 回车提交

51、 js随机整数函数

52、判断是否为空

53、 运行代码

54、 禁止复制黏贴

55、 防止页面被包含在 frame 里面

56、 防新浪微博文字滚动

57、 在光标处插入字符(兼容IE&FF)

58、 正则表达式验证数字(正整数, 负整数,整数,正小数,负小数,小数,实数,保留1,2,3位小数)

?

?

47. 打印对象

?

<script>function print_r(obj) {  var result = [];  for (var id in obj) {    try {      if (typeof(obj[id]) == "function") {        result.push("function " + id + ": " + obj[id].toString());      }      else {        result.push("property " + id + ": " + obj[id].toString());      }    } catch (err) {      result.push(id + ": inaccessible");    }  }  return result;}/*以下为测试代码*/var defaults = {  tablink           :'tablink',    tabcontent         :'tabcontent',  tabcount           :'4',          loadtab            :'1',           autochangemenu     :1,             changespeed        :2,            stoponhover        :0   }; var list = print_r(defaults);document.write(list.join("<br/>"));</script>
?

48、点击编辑:

?

JavaScript版

?

?

<!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><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>直接双击页面元素进行修改的HTML代码_IT知道网_</title><script type="text/javascript">function ShowElement(element){var tag = element.firstChild.tagName;if (typeof(tag) != "undefined" && tag == "INPUT")return;    var oldhtml = element.innerHTML;  //获得元素之前的内容     var newobj = document.createElement('input');   //创建一个input元素    newobj.type = 'text';   //为newobj元素添加类型newobj.value = oldhtml;newobj.style.width = element.width;       //设置newobj失去焦点的事件    newobj.onblur = function(){        element.innerHTML = this.value ? this.value : oldhtml;   //当触发时判断newobj的值是否为空,为空则不修改,并返回oldhtml。        }    element.innerHTML = '';   //设置元素内容为空    element.appendChild(newobj);   //添加子元素       newobj.focus() //获得焦点}</script></head><body>  <div onclick="ShowElement(this)">双击即可出现信息框</div></body></html>
??

jquery editable 插件 (详见附件)

?

?

$('.editable1').editable({onEdit:begin});
?

参考网址: http://arashkarimzadeh.com/index.php/jquery/7-editable-jquery-plugin.html

?

?

?

49、防止回车错误提交

?

如果一个form里面有多个input + submit按钮的话,那么在input里面回车一般默认为提交第一个,下面的代码可以防止这样的错误发生: (配合jquery使用)

?

    $("input").keypress(function (e) {        var keyCode = e.keyCode ? e.keyCode : e.which ? e.which : e.charCode;        if (keyCode == 13){            var i;            for (i = 0; i < this.form.elements.length; i++)                if (this == this.form.elements[i])                    break;            i = (i + 1) % this.form.elements.length;            this.form.elements[i].click();            return false;        }        else            return true;    });
?

?

50、 回车提交

?

$(document).ready(function(){$("按下回车的控件").keydown(function(e){         e = (e) ? e : (window.event ? window.event : "");?         var curKey = e.keyCode ? e.keyCode : e.which ? e.which : e.charCode;           if(curKey == 13){                $("#回车事件按钮控件").click();                return false;           }   });});
?

51、 js随机整数函数

?

?

function randomInt(x1,x2){  var min_int = parseInt(x1);  var max_int = parseInt(x2);  if ( isNaN(min_int) || isNaN(max_int) )  {    alert('parameter error');    return false;  }   x1 = Math.min(min_int,max_int);  x2 = Math.max(min_int,max_int);   return x1 + Math.floor(Math.random() * (x2 - x1 + 1));}//用法:var i = randomInt(1,100);    var j = randomInt('100abc','1000cd');
?

?

解析:首先将传过来的参数转化为整型,防止了传过来的参数是字符串的情况,这在直接将页面上的元素的值作为参数的情况下很有用。比如以下:

?

?var v1 = document.getElementById('ele1').value;

?var v2 = document.getElementById('ele2').value;

?var i = randomInt(v1,v2);

?

因为从页面获得的值是字符串的格式,所以函数先进行了一些判断操作。

?

Math.random()-返回0~1之间的一个随机的小数,不包含0和1;

?

?js取整

?

js取整分为3种情况:

Math.ceil(x)-向上取整,如x=5.1取整为6,x=5.8也取整为6;

Math.floor(x)-向下取整,如x=5.1取整为5,x=5.8也取整为5;

Math.round(x)-四舍五入取整,如x=5.1取整为5,x=5.8取整为6;

?

Math对象的其他函数:

Math.abs(x)-取绝对值,如x=-1去为1,x=0取0,x=1取1;

Math.pow(x,y)-取X的Y次幂,如x=10,y=2,则返回10的2次方,100;

Math.sqrt(x)-取平方根,如x=25,则返回5;

Math.min(x,y)-取最小值,返回X,Y中的小的数,如x=3,y=5则返回3;

Math.max(x,y)-去最大值,返回X,Y中的大的数,如x=3,y=5则返回5

?

?

51、 JavaScript 事件绑定和移除,兼容ie/fx/chrome

?

<input id="a" type="button" value="点我" />注意执行网页时该按扭并没有事件<br/><script language="javascript">var eventUtil = new Object();//oTarget:目标 sEventType:事件名称 fnHandler:事件触发的函数名//事件绑定eventUtil.addEventHandler = function(oTarget,sEventType,fnHandler){if(oTarget.addEventListener) oTarget.addEventListener(sEventType,fnHandler,false); //如果是FFelse if(oTarget.attachEvent) oTarget.attachEvent('on'+sEventType,fnHandler); //如果是IEelse oTarget['on'+sEventType] = fnHandler;};//事件移除eventUtil.removeEventHandler = function(oTarget,sEventType,fnHandler) {if(oTarget.removeEventListener) oTarget.removeEventListener(sEventType,fnHandler,false); //如果是FFelse if (oTarget.detachEvent) oTarget.detachEvent('on'+sEventType,fnHandler); //如果是IEelse oTarget['on'+sEventType] = null;};var a = document.getElementById("a");eventUtil.addEventHandler(a,'click',Hello_ok);function Hello_ok(){ alert("您好!欢迎您光临Web圈,祝您开心!"); }
?

onabort: 图像的加载被中断
onblur: 元素失去焦点
onchange: 域的内容被改变
onclick: 当用户点击某个对象时调用的事件句柄
ondblclick: 当用户双击某个对象时调用的事件句柄
onerror: 在加载文档或图像时发生错误
onfocus: 元素获得焦点
onkeydown: 某个键盘按键被按下
onkeypress: 某个键盘按键被按下并松开
onkeyup: 某个键盘按键被松开
onload: 一张页面或一幅图像完成加载
onmousedown: 鼠标按钮被按下
onmousemove: 鼠标被移动
onmouseout: 鼠标从某元素移开
onmouseover: 鼠标移到某元素之上
onmouseup: 鼠标按键被松开
onreset: 重置按钮被点击
onresize: 窗口或框架被重新调整大小
onselect: 文本被选中
onsubmit: 确认按钮被点击
onunload: 用户退出页面

?

?

52、判断是否为空

?

function empty (mixed_var) {    var key;        if (mixed_var === '' ||        mixed_var === ' ' ||                mixed_var === 0 ||        mixed_var === '0' ||        mixed_var === null ||        mixed_var === false ||        typeof mixed_var === 'undefined'    ){        return true;    }     if (typeof mixed_var == 'object') {        for (key in mixed_var) {            return false;        }        return true;    }     return false;}
?

?

if(empty(color)) alert('empty!');
?

53、 运行代码

?

<script language="javascript">function runCode(){var Code=Cont.value;var newwin=window.open('','','');newwin.opener=nullnewwin.document.write(Code);newwin.document.close();}</script><textarea name="Cont" cols="50" rows="10" id="Cont"></textarea><br><input type="button" name="Submit" value="运行代码" onClick="runCode()">

?

54、 禁止复制黏贴

?

?

<script>// check tel number and "-"function checktel() {    if (event.keyCode != 45 && (event.keyCode < 48 || event.keyCode > 57)) event.returnValue = false;}</script><body oncopy="return false;" onpaste="return false;" onselectstart="return false;" oncut="return false;"><input type="text" name="company_fax" id="company_fax" size="30" maxlength="20" onkeypress="checktel()" style="ime-mode:disabled" onpaste="return false;" tabindex="1"/></body>

?

?

55、 防止页面被包含在 frame 里面

?

?

<script type="text/javascript">function frameBuster() {if (window != top) top.location.href = location.href;}window.onload = frameBuster;</script>

?

56、 防新浪微博文字滚动 ??

?

?

 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script language="javascript"> $(function(){var scrtime;$("#con").hover(function(){            clearInterval(scrtime);         },function(){ scrtime = setInterval(function(){var $ul = $("#con ul");var liHeight = $ul.find("li:last").height();$ul.animate({marginTop : liHeight+40 +"px"},1000,function(){ $ul.find("li:last").prependTo($ul)$ul.find("li:first").hide();$ul.css({marginTop:0});$ul.find("li:first").fadeIn(1000);});        },3000);}).trigger("mouseleave"); }); </script> <style type="text/css"> *{ margin:0; padding:0;} ul,li{ list-style-type:none;} body{ font-size:13px; background-color:#999999;} #con{ width:700px; height:400px; margin:10px auto; position:relative; border:1px #666 solid; background-color:#FFFFFF;  overflow:hidden;} #con ul{ position:absolute; margin:10px; top:0; left:0; padding:0;} #con ul li{ width:100%;  border-bottom:1px #333333 dotted; padding:20px 0; overflow: } #con ul li a{ float:left;  border:1px #333333 solid; padding:2px;} #con ul li p{ margin-left:68px;line-height:1.5;  padding:10px;} </style> <div id="con">   <ul>     <li> <a href="http://www.websjy.com/bbs/"><img src="http://tp3.sinaimg.cn/1696357270/50/1282628065/1" /></a>         <p /></a>         <p /></a>         <p /></a>         <p /></a>         <p name="code"><html><head>    <script>        function AddText(str) {            var ubb = document.getElementById("text1");            var ubbLength = ubb.value.length;            ubb.focus();            if (typeof document.selection != "undefined") {                document.selection.createRange().text = str;            }            else {                ubb.value = ubb.value.substr(0, ubb.selectionStart) + str + ubb.value.substring(ubb.selectionStart, ubbLength);            }        }         function Underline() {            var tUnderline = prompt("请输入要设置的下划线文字\n标签:[u][/u]", "")//            if (tUnderline == "" || tUnderline == null) {                return;            }            tUnderline = "[u]" + tUnderline + "[/u]"            AddText(tUnderline);        }        var lastFocusObj;        function setlastFocusObj(obj) {            lastFocusObj = obj;        }    </script></head><body>    <textarea id="text1" cols="40" rows="8"></textarea>    <a href="javascript:Underline();void(0)">下线线</a></body></html>

?

?

58、 正则表达式验证数字(正整数, 负整数,整数,正小数,负小数,小数,实数,保留1,2,3位小数)

?

?

正整数:    <input type="text" size="20" onkeydown="if(event.keyCode == 13) alert(/^\d+$/.test(this.value));" /> <br> 负整数:    <input type="text" size="20" onkeydown="if(event.keyCode == 13) alert(/^-\d+$/.test(this.value));" /> <br> 整 数:    <input type="text" size="20" onkeydown="if(event.keyCode == 13) alert(/^-?\d+$/.test(this.value));" /> <br> 正小数:    <input type="text" size="20" onkeydown="if(event.keyCode == 13) alert(/^\d+\.\d+$/.test(this.value));" /> <br> 负小数:    <input type="text" size="20" onkeydown="if(event.keyCode == 13) alert(/^-\d+\.\d+$/.test(this.value));" /> <br> 小 数:    <input type="text" size="20" onkeydown="if(event.keyCode == 13) alert(/^-?\d+\.\d+$/.test(this.value));" /> <br> 实 数:    <input type="text" size="20" onkeydown="if(event.keyCode == 13) alert(/^-?\d+\.?\d*$/.test(this.value));" /> <br> 保留1位小数:<input type="text" size="20" onkeydown="if(event.keyCode == 13) alert(/^-?\d+\.?\d{0,1}$/.test(this.value));" /> <br> 保留2位小数:<input type="text" size="20" onkeydown="if(event.keyCode == 13) alert(/^-?\d+\.?\d{0,2}$/.test(this.value));" /> <br> 保留3位小数:<input type="text" size="20" onkeydown="if(event.keyCode == 13) alert(/^-?\d+\.?\d{0,3}$/.test(this.value));" /> 

?

?

?

?

转帖注明:http://justcoding.iteye.com/blog/734964

热点排行