手机（文本框）：<input type="text" name="" maxlength="11" placeholder="" autocomplete="off"> 基本的表单验证 <script>$(function(){$(.fr-form).submit(function(event){event.preventDefault();//阻止表单提交事件 $(this).find(.error-tip).html(); var name = $(.username); var mobile = $(.mobile); var regTest = /^1[3|4|5|7|8][0-9]{1}[0-9]{8}$|15[0-9]{1}[0-9]{8}$|18[0-9]{1}[0-9]{...
下面小编就为大家带来一篇JavaScript之事件委托实例(附原生js和jQuery代码)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧事件委托的原理依赖于事件冒泡，可以通过给父元素的事件委托来确定是哪个子元素触发了事件从而做一系列操作。使用事件委托的优点1、操作子元素时不用一一遍历，可以根据事件触发的对象而进行相应操作dom结构如下：<ul id = "oUl"><li class = "item"></li><li class = "it...
如何使用JavaScript动态改变iframe的src属性的示例代码分享<iframe id="xx"></iframe> <iframe id="yy"></iframe> <script>var xxObj = document.frames; xxObj[0].src="index.htm";</script>iframeID.location=newURL <iframe id="myIframe"></iframe><script language="javascript"> myIframe.src = "index.htm";</script>document.frames[0].location.href =url; window.frames["iframeName属性"].location.href="xxxx.asp" ...
导航条背景切换的效果，想必大家在浏览网页时可能会碰到过，下面为大家介绍下使用jquery如何实现，具体思路及代码如下，感兴趣的朋友可以参考下效果如下： 代码如下:<DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery-2.0.3.min.js"></script> <meta charset="UTF-8"> <style> .nav{height:40px; width: 100%;background: #E6E6E6;} .nav ul li{float: left;list-style: none;margin-right: 20px...
先给大家说下游戏规则：在变化数量的颜色块里找出一个不同颜色的块点击。下面通过js代码给大家分享找不同色块的游戏实现方法，需要的朋友参考下吧游戏规则：在变化数量的颜色块里找出一个不同颜色的块点击这里使用了JS中的构造函数来创建元素<!DOCTYPE html> <html> <head lang="en"><meta charset="UTF-8"><title>找不同色块的游戏（构造函数）</title> </head> <style>*{margin: 0;padding: 0;}#box{width: 600px;height: 600px;...
html结构<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Document</title><style>*{margin:0;padding:0;font-size:14px;-webkit-user-select:none;}ul,li{list-style:none;}img{display:block;border:none;}a{display:block;color:#000;text-decoration: none;}a:hover,a:active,a:visited,a:target{display:block;color:#000;text-decoration: none;}.banner{position:relative;margin:0 auto;width:1000p...
在制作网页或移动端有时会用到一个效果，类似文章标题和文章描述的排列总是保持一样的行数，要么标题总是一行，多出的省略，要么标题内容1：3或2：2或3：1这样，今天练习这样的效果。实现的原理：给标题和内容分别加上行高，获取标题的高度除以自身的行高，得知标题的行数，再分配内容的行数即可。<style>*{padding: 0;margin: 0; font-family: Microsoft Yahei}.book{width: 320px;border: 1px solid #ccc;}.bookli{padding: 5px ...
闲言碎语不多说，直接上代码，看看你能领悟到多少。<!DOCTYPE html> <html><head><meta charset="utf-8" /><title>图片在浏览器窗口水平居中展示（图片尺寸不限制）</title><style>* {margin: 0;padding: 0;background: #606060}html {height: 100%;}body {position: relative;min-height: 100%;}#img-center {width: 800px;margin: 0 auto;display: block;margin-top: 2%;margin-bottom: 2%;cursor: zoom-in;}</style><script>win...
Cookie实现留言板的实例代码分享直接代码:<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <style>#input{width: 400px;height: 400px;} </style> <script>function setCookie(name, value, iDay){var oDate=new Date();//用来设置过期时间用的，获取当前时间加上传进来的iDay就是过期时间oDate.setDate(oDate.getDate()+iDay); document.cookie=name+=+va...
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>Title</title> </head><body> <h1 id="demo1"></h1> <h1 id="demo2"></h1><script>var person = {firstName: "John",lastName : "Doe",id : 5566,fullName : function(){return this.firstName + " " + this.lastName;}};document.getElementById("demo1").innerHTML = "不加括号输出函数表达式：" + person.fullName;document.getElementById("demo2").inn...
这篇文章主要介绍了Jquery利用mouseenter和mouseleave实现鼠标经过弹出层且可以点击。需要的朋友可以过来参考下，希望对大家有所帮助实例如下所示：<html xmlns="http://www.w3.org/1999/xhtml"> <head><title>Jquery利用mouseenter和mouseleave实现鼠标经过弹出层且可以点击</title><script src="JS/jquery-1.9.1.js" type="text/ javascript "></script><script type="text/javascript">$( document ).ready(function () {var ps...
但是由于javascript的dom事件传播机制,不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件,不论鼠标指针离开被选元素还是任何子元素，都会触发 mouseout 事件。所有jquery提供了mouseenter和mouseleave事件来终止事件传播，使事件只发生在选中的元素上。只有在鼠标指针穿过被选元素时，才会触发 mouseenter 事件。只有在鼠标指针离开被选元素时，才会触发 mouseleave 事件。例<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML...
在每一个匹配元素的change事件中绑定一个处理函数。change事件会在元素失去焦点的时候触发，也会当其值在获得焦点后改变时触发。Jquery的基本语法： $("input[type=text]").change( function() { // 这里可以写你想要的验证代码； });2 当绑定一个文本框的时候 $(function () { $("#txtAssessmentTotal").change(function () { //这里写你想要的验证的代码； }) })为每个匹配元素的特定事件绑定事件处理函数。 .bind() 方法是...
在jquery中失去焦点 事件我们只要使用blur来绑定就可以了，这样我们可以实时监控到输入框的blur动作了。一个监制text事件$(function () { $(:text).blur(function () { if ($.trim($(this).val())==) { $(this).css(border, red); } else { $(this).css(border,white); } }); });实例<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script><script language="javascript" type="text/javascript">//失去焦点时判...
这篇文章主要介绍了Javascript实现的StopWatch功能,结合具体实例形式分析了javascript自定义StopWatch实现测试运行时间功能的相关操作技巧,需要的朋友可以参考下本文实例讲述了Javascript实现的StopWatch功能。分享给大家供大家参考，具体如下：有时会需要js来写一些函数进行测试，如果需要测试执行时间，可能需要一个stopwatch：StopWatch类：function stopWatch() { } stopWatch.prototype.Start = function () {this.startD = n...