JavaScript备忘

js创建数组的方式

var arr=new Array()arr.push("zhangsan");arr[1]="lisi";

或

var arr=["zhangsan"];//var arr=[];arr.push("lisi");arr[2]="wangwu";

js创建对象（以及键值对、Map）的方式

var obj=new Object();obj.name="zhangsan";

或

var obj={name:"zhangsan"};//var obj={};obj.sex="1";

或

var obj=function(){}obj.name="zhangsan";

找出元素在数组中的索引

js数组没有indexOf方法，不过可以借助JQuery的inArray方法

$.inArray(element,array)

字符串转数字

new Number(str)Number(str)parseInt(str)parseInt(str,进制)parseFloat(str)

判断checkbox是否选中：

document.getElementById(checkbox_id).checked$(checkbox_id).get(0).checked$(checkbox_id).is(":checked")$(checkbox_id).attr("checked")

dwr设置同步与异步

DWREngine.setAsync(false);//设置dwr为非异步（同步）...//dwr调用DWREngine.setAsync(true);//还原dwr为异步

或者

dwr.engine.setAsync(false);//设置dwr为非异步（同步）...//dwr调用dwr.engine.setAsync(true);//还原dwr为异步

设置和获取属性值

document.getElementById(id).setAttribute(attrName,attrValue);attrValue=document.getElementById(id).getAttribute(attrName);$(id).attr(attrName,attrValue);attrValue=$(id).attr(attrName);//data方式常用于存放数据$(id).data(attrName,attrValue);attrValue=$(id).data(attrName);

格式化小数

不四舍五入保留2位小数，不够位数，则用0填充

var result=num.toFixed(2);

四舍五入保留2位小数，不够位数，则用0填充

function toFixedAndRound(num) {  var result = parseFloat(num);  if (isNaN(result)) {    return result;  }  result = Math.round(num * 100) / 100;  var s= result.toString();  var i= s.indexOf('.');  if (i< 0) {    i = s.length;    s+= '.';  }  while (s.length <= i+ 2) {    s += '0';  }  return s;}

iframe获取兄弟节点iframe对象

var brotheriframe = window.parent.兄弟节点iframe的id或name;

校验

jqueryvalidation

官网：
jquery校验插件官方网站
示例：

validation-engine

地址：http://code.ciaoca.com/jquery/validation-engine/
示例：

自己写统一校验方法

function verifyForm(){        var requireds = $("input[required=required]");//还可以根据length属性校验长度，根据type属性校验数据类型以此类推，甚至可以在输入元素里增加regex属性，直接用正则判断是否合法。        for(var i=0;i<requireds.length;i++){            var box=requireds[i];            if(box.value==""){                $("#msg").html(box.name+"为空");//box.name可以使用某种方法替换成对应中文，如在属性里加个zh_name                return false;            }        }        return true;    }

表单工具

jquery.form

树tree

zTree

dTree

table框架

datatables

官网：
示例：

文件操作框架

文件上传框架

plupload

plupload支持进度条功能，在上传多个文件时，是把每个文件分开上传处理的，就是说一次请求服务器只会收到一个文件，plupload会多次请求来上传多个文件，并且每上传一个文件成功后，进度都会刷新。

官网：http://www.plupload.com/
示例：

uploadify

示例：

<a href="javascript:;" id="uploadify">浏览</a><br/><script>            $("#uploadify").uploadify({                swf             : "assets/Plugin/uploadify/uploadify.swf",                queueID         : "queuediv",                buttonClass     : "btnCls",                onUploadSuccess : function(file, data, response) {                    var json = eval("("+data+")");                    if(json.success){                        $("#artImgInput").val(json.newName);                        $("#artImg").attr("src",json.spath+"/"+json.newName);                    }                }            });</script>

日期选择器

bootstrap-datepicker

官网：http://bootstrap-datepicker.readthedocs.io/en/latest/

jquery-datepicker

官网：http://plugins.jquery.com/ui.datepicker/

jquery-datetimepicker

官网：http://plugins.jquery.com/datetimepicker/

glDatePicker

官网：http://glad.github.io/glDatePicker/

my97DatePicker（WdatePicker）

官网：http://www.my97.net/index.asp

图标工具

fontawesome

官网：http://fontawesome.dashgame.com/
官网2：www.bootcss.com/p/font-awesome/design.html

下拉框

bootstrap下拉框

bootstrap-select

多选下拉框

jquery-multi-select

带搜索下拉框

select2
官网：https://select2.org/

加载模态显示

showLoading

图片拖拽工具

图片缩略图、裁剪工具

图片大图展示、翻页图片工具

jquery.boilerplate

官网：
http://plugins.jquery.com/boilerplate/
https://jqueryboilerplate.com/
https://github.com/jquery-boilerplate/jquery-boilerplate

富文本编辑器

kindeditor

官网：http://kindeditor.net/
示例：

<script type="text/javascript" src="assets/Plugin/kindeditor/kindeditor.js"></script><textarea id="newsContent" name="newsEn.newsContent" style="width:1010px; height:380px;">${requestScope.newsEn.newsContent }</textarea><script>            editor = KindEditor.create("textarea[id='newsContent']",{                formData: {"folder":"fixed"},                resizeMode : 1,                allowImageUpload : true,                urlType : 'absolute',                allowPreviewEmoticons:false,                uploadJson : "uploadAction!HtmlEditorUpload.action",                items:StaticParam.items            });</script><script type="text/javascript" src="<%=path%>/resources/js/kindeditor-4.1.10/kindeditor.js"></script><script type="text/javascript" src="<%=path%>/resources/js/kindeditor-4.1.10/plugins/code/prettify.js"></script><script type="text/javascript" src="<%=path%>/resources/js/kindeditor-4.1.10/lang/zh_CN.js"></script><textarea type="text" value="" name="content" style="height:500px;" class="edit_text" id="article.content1"></textarea><script>    KindEditor.ready(function(K) {        var editor1 = K.create('textarea[id="article.content1"]', {            uploadJson : '<%=path%>/upload_json.jsp',            // 获取远程服务器的文件            fileManagerJson : '<%=path%>/file_manager_json.jsp',            allowFileManager : true,            afterBlur:function(){this.sync();}        });        prettyPrint();    });</script>