js代码 | 易学教程

bootstrap-datepicker 与bootstrapValidator同时使用时，选择日期后，无法正常触发校验

阅读更多关于 bootstrap-datepicker 与bootstrapValidator同时使用时，选择日期后，无法正常触发校验

bootstrap-datepicker 与bootstrapValidator同时使用时，选择日期后，无法正常触发校验 (解决办法) http://blog.csdn.net/biedazhangshu/article/details/51657292 （博客网址）问题描述： bootstrapValidator插件默认情况下，不会重复校验一个已经标记为验证通过或验证不通过的字段。so ，当开始触发校验后，没有通过校验，当正确选择日期后，并不会刷新校验结果，就会导致数据无法正常提交问题解决：根据应用场景分析，当日期选择插件关闭时，期望能够触发校验。所以使用bootstrap-datepicker的hide方法。当日期选择框关闭时，执行刷新校验。代码如下： js: /* 加载时间选择插件 */ $("#f_workr_remind_date").datepicker({ todayBtn : "linked", autoclose : true, todayHighlight : true, endDate : new Date() }).on('hide',function(e) { //当日期选择框关闭时，执行刷新校验 $('#project_form').data('bootstrapValidator').updateStatus('f_workr_remind

使用js设置input标签只读 readonly 属性

阅读更多关于使用js设置input标签只读 readonly 属性

本文转载自： http://www.cnblogs.com/jinghun/p/6070612.html 作者：jinghun 转载请注明该声明。　　先上代码： <html> <head> <title> test </title> <meta charset="utf-8"> </head> <script language="JavaScript"> function setReadonly() { // document.getElementById("test").setAttribute("readOnly", true); document.getElementById("test").readOnly=true ; } function readWrite() { // document.getElementById("test").setAttribute("readOnly", false); document.getElementById("test").readOnly=false ; } </script> <body> <form name="addform" id="addform" method="post" action=""> <input type="text" id="test" > <input type="button" value=

使用js实现splice方法

阅读更多关于使用js实现splice方法

splice无疑是最强大的数组方法，出于兴趣，现在使用js来实现splice方法，实现之前必须了解splice方法的功能是怎么样的功能需求：删除，插入，替换，而这三个功能是通过改变函数参数来实现的两个参数情况（删除）：第一个参数表示要删除项的索引，第二个参数表示要删除的项数，三个以上包括三个参数情况（插入和替换）：第一参数表示起始位置，第二个参数表示要删除的项数（该项为0的话为插入，大于0的话为替换），第三个及以后的参数表示要插入的项。实现思路描述：要理解js函数中的参数的概念，参数在内部是用一个数组来表示的，在函数体内是通过arguments对象来访问参数数组的。所以可以通过arguments来实现此方法。实现代码： <script type="text/javascript"> var arr=[1,2,3,4,5,6,7,8,9]; //使用js实现splice方法，写的比较粗糙，对参数判断不够细腻 function jsSplice(){ var index=arguments[0]; var num=arguments[1]; var len=arguments.length; var result=[],content=[]; //删除 if(len==2){ result=arr.slice(0,index).concat(arr.slice

JS监听div的resize事件

阅读更多关于 JS监听div的resize事件

原文地址： http://zhangyiheng.com/blog/articles/div_resize.html 需求开发过程中经常遇到的一个问题就是如何监听一个div的size变化。比如我用canvas绘制了一个chart，当canvas的size发生变化的时候，需要重新绘制里面的内容，这个时候就需要监听resize事件做处理。 window上虽然可以添加resize事件监听，但这并不能满足我们的需求，因为很多时候，div的size发生了变化，但是window的size并没有改变。不过我们可以间接利用window的resize事件监听来实现对于某个div的resize事件监听，请看下面具体实现。对于div的resize事件的监听，实现方式有很多，比如周期性检查，通过scroll事件等等，本文主要介绍通过 object 元素来实现监听。具体实现 /** * Created by taozh on 2017/5/6. * taozh1982@gmail.com */ var EleResize = { _handleResize: function (e) { var ele = e.target || e.srcElement; var trigger = ele.__resizeTrigger__; if (trigger) { var handlers =

Js变量定义——fn里 var与不var的区别

阅读更多关于 Js变量定义——fn里 var与不var的区别

js运行时内置了一个Global对象。这个Global对象跟运行环境有关。在浏览器运行环境中。Global就是window对象。在nodejs中。Global对象是global对象。当你在浏览器环境中，直接使用一个未经定义的变量，例如foo=123;那么foo这个变量自动声明为全局变量。变量引用自动挂载到了Global对象，即window对象上，使用上等同于全局对象的属性，你可以试试来验证。如： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <script> var a=3; console.log(window.a); //3 </script> </body> </html> 　　在全局对象下定义的函数体里，不用var声明的变量，首先，它会尝试在当前作用域链（如在方法中声明，则当前作用域链代表全局作用域和方法局部作用域etc。。。）中解析该变量; 如果在任何当前作用域链中找到该变量，则会执行对该变量赋值；如果没有找到该变量，它才会在全局对象（即当前作用域链的最顶层对象，如window对象）中定义该变量为全局变量并赋值。测试代码如下： <!DOCTYPE html> <html lang="en">

javascript进阶笔记(1)

阅读更多关于 javascript进阶笔记(1)

学习js已经有一段时间了，大大小小还是能够做出一些东西来。不过觉得可惜的是，还是对js本身这门语言不是很熟悉，总有一点雾里看花的感觉，看得见，但是看不清楚。最近发现有一本关于js的叫做《忍者秘籍》的书刊，听说是jQuery作者写的，可以让初级者进阶，哇啦啦，打怪兽，加经验升级，多好的事情。于是，就有了此篇文章及其后续。闲话休谈，正事要紧！ javascript是一门函数式语言(functional language)。最重要的，在js中，函数是第一型对象(first-class object) ，也就是说，函数可以共处，可以将其视为其他任意类型的javascript对象。就像普通的js数据类型，函数可以被任意变量进行引用，或声明成对象字面量，甚至可以将其作为函数参数进行传递。函数的第一型对象体现在： 1、它们可以通过字面量进行创建； 2、它们可以赋值给变量、数组或其他对象的属性； 3、它们可以作为参数传递给函数； 4、它们可以作为函数的返回值进行返回； 5、它们拥有动态创建并赋值的属性。函数除了以上的功能外，它还包含一个功能，它们可以被调用。千万不要小瞧了函数的调用！因为不同的调用机制会产生不同的功效，特别是针对函数的this关键字。当我们定义了一个函数，以便其他一些代码在适当的时候回头调用它，我们可以称之为回调。回调是高效利用js必不可少的一部分。

js中创建命名空间的几种写法

阅读更多关于 js中创建命名空间的几种写法

在JavaScript中全局变量经常会引起命名冲突，甚至有时侯重写变量也不是按照你想像中的顺序来的，可以看看下面的例子： var sayHello = function() { return 'Hello var'; }; function sayHello(name) { return 'Hello function'; }; sayHello(); 最终的输出为 > "Hello var" 为什么会这样，实际上JavaScript的是按如下顺序解析的。 function sayHello(name) { return 'Hello function'; }; var sayHello = function() { return 'Hello var'; }; sayHello(); 不带var的function声明被提前解析了，因此现代的JS写法建议你始终使用前置var声明所有变量；避免全局变量名冲突的最好办法还是创建命名空间，下面是在JS中合建命名空间的几种常用方法。通过函数（function)创建这是一种比较常见的写法，通过声明一个function实现，函数里设置初始变量，公共方法写入prototype，如： var NameSpace = window.NameSpace || {}; /* Function */ NameSpace.Hello =

原生js的Ajax请求详解

阅读更多关于原生js的Ajax请求详解

Ajax是可以用来与服务器进行通讯的一种技术，它可以在不刷新页面的情况下进行异步通讯并获得返回结果。 Ajax常用的请求方式有两种，GET和POST，接下来将详细给出这两种请求方式的异同，以及Ajax使用时需要注意的地方。 1 GET请求 get请求一般用在向服务器请求某些资源，例如请求一段文章，或者一张图片等等。下面是完整的get请求的方式我们可以看到，在获得XMLHttpRequest对象的时候我们进行了一个判断，这是因为所有现代浏览器 (IE7+、Firefox、Chrome、Safari 以及 Opera) 都内建了 XMLHttpRequest 对象，而IE6或以下的需要用到ActiveXObject才能构建，所以需要进行判断，不过这个判断不加似乎也没事，因为现在几乎不可能有人使用IE6以下的浏览器了 let url = "http://localhost/StarRing/public/StarRing.php/StarRing/Articles/AjaxGet"; //1 定义xmlHttpRequset对象 let xmlHttp; if (window.XMLHttpRequest) { xmlHttp = new XMLHttpRequest(); } else if (window.ActiveXObject) { xmlHttp = new

JS 图片转Base64

阅读更多关于 JS 图片转Base64

JS 图片转Base64 有时候需要向HTML中插入一张图片，可苦于上线后找不到一个合适的网盘来存储这些图片，有没有一种办法能将图片转换成文字，然后直接插入HTML中呢，通过 Base64 编码就可以解决这个问题。废话不多说直接上代码。不知道什么是 Base64 的请自行百度。 JS 图片转Base64 图片转Base64 示例代码 <!DOCTYPE html > <html> <head> <meta charset = "UTF-8" > <title> JS 图片转Base64 </title> <script src = "//cdn.bootcss.com/jquery/2.2.0/jquery.min.js" ></script> <script> function run ( input_file , get_data ){ /*input_file：文件按钮对象*/ /*get_data: 转换成功后执行的方法*/ if ( typeof ( FileReader ) === 'undefined' ){ alert ( "抱歉，你的浏览器不支持 FileReader，不能将图片转换为Base64，请使用现代浏览器操作！" ); } else { try { /*图片转Base64 核心代码*/ var file = input_file . files [

JS设计模式（13）状态模式

阅读更多关于 JS设计模式（13）状态模式

什么是状态模式？定义：将事物内部的每个状态分别封装成类，内部状态改变会产生不同行为。主要解决：对象的行为依赖于它的状态（属性），并且可以根据它的状态改变而改变它的相关行为。何时使用：代码中包含大量与对象状态有关的条件语句。如何解决：将各种具体的状态类抽象出来。应用实例： 1、打篮球的时候运动员可以有正常状态、不正常状态和超常状态。 2、曾侯乙编钟中，'钟是抽象接口','钟A'等是具体状态，'曾侯乙编钟'是具体环境（Context）。优点： 1、封装了转换规则。 2、枚举可能的状态，在枚举状态之前需要确定状态种类。 3、将所有与某个状态有关的行为放到一个类中，并且可以方便地增加新的状态，只需要改变对象状态即可改变对象的行为。 4、允许状态转换逻辑与状态对象合成一体，而不是某一个巨大的条件语句块。 5、可以让多个环境对象共享一个状态对象，从而减少系统中对象的个数。缺点： 1、状态模式的使用必然会增加系统类和对象的个数。 2、状态模式的结构与实现都较为复杂，如果使用不当将导致程序结构和代码的混乱。 3、状态模式对"开闭原则"的支持并不太好，对于可以切换状态的状态模式，增加新的状态类需要修改那些负责状态转换的源代码，否则无法切换到新增状态，而且修改某个状态类的行为也需修改对应类的源代码。使用场景： 1、行为随状态改变而改变的场景。 2、条件、分支语句的代替者。

订阅 js代码