js的几个案例

<html>
  <head lang="en">
      <meta charset="UTF-8">
      <title></title>
      <script type="text/javascript">
          function fun1(){
              alert("buchenggong");
              return false ;
          }
   
          function fun2(){
             return  confirm("你确定要提交吗？")
          }
   
          function fun3(){
  return confirm("你确定要重置吗？");
          }
   
      </script>
  </head>
  <body>
      <a href="http://www.baidu.com" onclick="return fun1()">baidu</a>
   
      <form action="" method="get">
   
          <input type="text" value = "hello"/>
          <input type = "submit" value="tijiao" onclick=" return fun2()" />
          <input type="reset" value = "重置" onclick="return fun3()"/>
      </form>
  </body>
  </html>

<html>
  <head lang="en">
      <meta charset="UTF-8">
      <title></title>
      <script type="text/javascript">
          function fun1(){
              alert("buchenggong");
              return false ;
          }
   
          function fun2(){
             return  confirm("你确定要提交吗？")
          }
   
          function fun3(){
  return confirm("你确定要重置吗？");
          }
   
      </script>
  </head>
  <body>
      <a href="http://www.baidu.com" onclick="return fun1()">baidu</a>
   
      <form action="" method="get">
   
          <input type="text" value = "hello"/>
          <input type = "submit" value="tijiao" onclick=" return fun2()" />
          <input type="reset" value = "重置" onclick="return fun3()"/>
      </form>
  </body>
 
</html>
  <!DOCTYPE html>
  <html>
  <head lang="en">
      <meta charset="UTF-8">
      <title></title>
      <script type="text/javascript">
          //var reg = /test/
   
          function fun1(){
              /*var reg = /test/g;
              var textA = document.getElementsByTagName("textarea")[0]
              var text = textA.value;
              alert(reg.source)
              reg.compile(/text/);
   
   
              var arr = text.match(reg);
              alert(arr);*/
  /*
              var reg = /test/gi
   
   
              var str = "asdfasdftest_Test-text";
   
              alert(reg.exec(str))
              alert(reg.exec(str))
              alert(reg.exec(str))
              alert(reg.lastIndex)*/
   
              var str = "ccccc ccc cccc ddd"
   
              var str = "csdfaaaaa.  aa  aa"
              var str ="\nwww.acombaidu.com"
   
              str = "ssdfkjSDFSDFab32132---csbkdf"
   
              //str = "today is tuesday how are you"
   
              //var reg = /([A-Z])|([0-9]+)/g;
   
   
              /*
              reg = /[^a-zA-Z0-9]+/g
   
             // reg.compile(/a\./g)
   
   
              alert(str.match(reg));
  */
  /*
   
              str = "158222656"
              str = document.getElementById("phone").value;
   
              //asdfasdfqq.com
   
              reg = /(([0-9a-z]){1,12})@(qq|sina|163)(\.com|\.cn)/g
   
              //reg =/^1[35789][0-9]{8}[0-9]$/;
              alert(reg.test(str));*/
   
   
              /*
              reg = /1[35789]\d{8}\d$/
              str = "test#$%[email protected]#$_a   sdfsdfts5656jadflj"
              reg = /\S+/g
              str = "asdfas123FFSDFsdfsdfs##$#[email protected]"
              reg = /^\w{1,12}@(qq|sina|163)(\.com|\.cn)/
              //reg = /\s/g
              var arr = reg.test(str);
              alert(arr)
              //alert("|"+arr[0]+"|"+"|"+arr[1]+"|"+"|"+arr[2]+"|");*/
   
              str = "asdfhelloaaworldaa"
  /*
              0-255.0-255.0-255.0-255
              reg = /([1-9]|([1-9][0-9])|((1[0-9][0-9])|(2[0-4][0-9]|25[0-5]))\.){3}/
              reg =/aa(?!hello)/
              alert(reg.exec(str));
              /*
              str = "dd a3a3 ffddddaaaa baba3333 "
   
   
              str = str.replace(/([0-9a-z])\1{3}/g,"****");
              str = str.replace(/(\w)\1/g,"--")
              str = str.replace(/([a-z])([0-9a-z])\1\2/g,"#$#$")
              alert(str);
              /*
              //reg=/aa|dd/
              reg = /([a-z])([0-9])\1\2/g
              alert(str.match(reg));
   
              //alert(reg.exec(str));*/
   
              str = "alhsdkfjlkjHelloasdfworldhowasdf"
              str = "2+3.2-3*4/5=5;"
   
              //alert(str.split(/\/|\*|-|\+|=/));
   
              str = "asdf_"
              reg = /[0-9a-z_]+/;
   
              str = "adfaasdfsdfasdfsdafasdfasdf"
              reg = /^[a-z][a-z]{5,}[a-z]$/
              alert(reg.test(str));
              //asdfasdf *&(*&( [email protected]
              //reg = /^[a-z0-9]\w{1,12}@(qq|sina|163)(\.com|\.cn)/
   
          }
   
   
   
   
   
      </script>
  </head>
  <body>
   
  <textarea cols="40" rows="5">
   
   
  </textarea>
   
  电话 ：<input type="text" id="phone"/>
  <input type="button" onclick="fun1()" value="clickMe"/>
  </body>
  </html>
  <!DOCTYPE html>
  <html>
  <head lang="en">
      <meta charset="UTF-8">
      <title></title>
   
   
      <style type="text/css">
          .td{
              color: red;
              font-size: 13px;
          }
   
      </style>
      <script type="text/javascript">
          var str = [0,0,0,0]
   
          window.onload = function(){
   
              isNumOrChar("123123f")
              var inputs = document.getElementsByName("text")
              for(var i=0;i<inputs.length;i++){
                  inputs[i].onblur = function(){
                      var input = document.getElementById("tijiao")
                      var text = this.value.trim()
                      var tr = this.parentNode.parentNode;
                      var text1 = tr.cells[0].textContent;
                      var text2 = text1.substring(0,text1.length-1)
                      if(text.length==0&&(text2=="用户名"||text2=="密码")){
                          tr.cells[2].innerHTML = text2+"不能为空";
                          if(text2=="密码"){
                              str[1] = 0;
                          }else{
                              str[0] = 0;
                          }
                      }
                      else if(text.length<6&&(text2=="用户名"||text2=="密码"))
                      {
                          tr.cells[2].innerHTML = text2+"长度不能小于6";
                          if(text2=="密码"){
                              str[1] = 0;
                          }else{
                              str[0] = 0;
                          }
                      }
                      else if(isNumOrChar(text)&&(text2=="用户名"||text2=="密码")){
                          tr.cells[2].innerHTML = text2+"不能纯数字或者纯字母";
                          if(text2=="密码"){
                              str[1] = 0;
                          }else{
                              str[0] = 0;
                          }
                      }
                      else if(text2=="邮箱"&&text.length==0){
                          tr.cells[2].innerHTML = text2+"不能为空";
                          str[2] = 0;
                      }
                      else if(text2=="邮箱"&&isNotEmail(text))
                      {
                          tr.cells[2].innerHTML = text2+"格式不正确";
                          str[2] = 0;
                      }
                      else if(text2=="手机"&&text.length==0)
                      {
                          tr.cells[2].innerHTML = text2+"不能为空";
                          str[3] = 0;
                      }else if(text2=="手机"&&isNotPhone(text))
                      {
                          tr.cells[2].innerHTML = text2+"格式不正确";
                          str[3] = 0;
                      }
                      else{
                          tr.cells[2].innerHTML = "";
                          switch (text2){
                              case "手机":
                                  str[3] = 1;
                                      break;
                              case "邮箱":
                                  str[2] = 1;
                                      break;
                              case "用户名":
                                  str[0] = 1;
                                      break;
                              case "密码":
                                  str[1] = 1;
                                      break;
                          }
                      }
   
                      if(str.toString()=="1,1,1,1"){
                          input.disabled = false;
                      }else{
                          input.disabled = true;
                      }
                  }
              }
          }
   
          function isNumOrChar(str){
   
              var reg = /^\d\d{4,}\d$/g
              var reg1 = /^[a-z][a-z]{4,}[a-z]$/g
   
             return (reg.test(str)||reg1.test(str))
          }
   
          function isNotEmail(str){
              var reg = /^\w\w{5,12}@(qq|sina|163)(\.com|\.cn)/g
              return !reg.test(str);
          }
   
          function isNotPhone(str){
              var reg = /^1[35789]\d{8}\d$/
              return !reg.test(str)
          }
   
      </script>
  </head>
  <body>
      <form>
          <table>
              <tr>
                  <td>用户名:</td>
                  <td><input type ="text" name = "text"/></td>
                  <td class="td"></td>
              </tr>
              <tr>
                  <td>密码:</td>
                  <td><input type ="password" name = "text"/></td>
                  <td class="td"></td>
              </tr>
              <tr>
                  <td>邮箱:</td>
                  <td><input type ="text" name = "text"/></td>
                  <td class="td"></td>
              </tr>
   
              <tr>
                  <td>手机:</td>
                  <td><input type ="text" name = "text"/></td>
                  <td class="td"></td>
              </tr>
              <tr>
                  <td></td>
                  <td colspan="2">
                      <input type="submit" value="submit" disabled = "disabled" id="tijiao"/>
                      <input type="reset" value="reset"/>
                  </td>
   
              </tr>
          </table>
   
      </form>
  </body>
  </html>
时间： 2024-08-24 09:22:27

js的几个案例的相关文章

echarts &nbsp; js 模板制作 地图 案例分享

今天分享一个 echarts   js 模板制作 地图 案例,有类似需求的筒子可以参考 O(∩_∩)O 需求:因为最近管理的全国各地代理服务器越来越多,有时上级需要看下我们的代理分布,比如带宽,比如供应商,如果用纯excel不是很直观,就套用了前端的Js模板,修改了些代码,填充部分值进去,就出来基本效果了. 上效果图: 基本上把全国各地的资源情况很直观的显示出来了,这里只填充了部分值,后期会将值存入mysql,并且用上ajax 来塞值,这里就列个基本的效果图. 5分钟上手echarts,官网教程

用JS添加文本框案例代码

<!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-

用原生JS写移动动画案例及实际应用

js很强大 相信很多人都知道,那么它有哪些强大之处呢?有兴趣的人可以去查查,这里就不赘述了,因为不在本片文章讨论的范围. 我们要讲的是怎么用原生JS写移动动画?我们先举一个最简单的动画例子,很多网站的左边或右边会有个分享的框,鼠标放上去就还移出一个列表,里面是要分享的地址.鼠标移开,就会移进去. 要实现这个效果要怎么做呢? 可以想一想,鼠标经过和鼠标离开很好理解 用onmousemove事件和onmouseout事件就能完成. 那移动动画呢?我们可以一步一步思考, 首先,一开始是这样的 完成移动

JS冒泡和闭包案例分析

背景: 今天逛网页发现了百度知道上一个有意思的JS问题,提问者的问题事实上蛮简单的,懂点前端开发技术的应该都能实现.提问者的要求:实现子菜单的弹出,菜单共同拥有三级.每级菜单显示时有500毫秒的延迟.然后提问者贴出了他的问题代码. 对别人贴出来的代码.仅仅要不是特别复杂,我都会看一眼. 毕竟程序猿交流,源码是最好的语言,刚開始看他的代码就有点感觉哪里不正确. 后来细致分析了下.发现确实是蛮有意思的. 假设感觉分析过程比較无聊.能够直接看结论. 以下是他的代码: <html> <head&

js构建函数优秀案例

这几个效果函数是看到别人写的,挺好的,复制下来学习备用! 函数封装: //var _hmt = _hmt || [];(function() {var hm = document.createElement("script");hm.src = "//hm.baidu.com/hm.js?62be88d37b49a5ca149df10c84d83824";var s = document.getElementsByTagName("script"

微信JS SDK Demo 官方案例

转自:http://my.oschina.net/superkangning/blog/367484 微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包. 通过使用微信JS-SDK,网页开发者可借助微信高效地使用拍照.选图.语音.位置等手机系统的能力,同时可以直接使用微信分享.扫一扫.卡券.支付等微信特有的能力,为微信用户提供更优质的网页体验. 此文档面向网页开发者介绍微信JS-SDK如何使用及相关注意事项. 一:html代码部分 ? 1 2 3 4 5 6 7 8 9

微信JS SDK Demo 官方案例[转]

摘要: 微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包. 通过使用微信JS-SDK,网页开发者可借助微信高效地使用拍照.选图.语音.位置等手机系统的能力,同时可以直接使用微信分享.扫一扫.卡券.支付等微信特有的能力,为微信用户提供更优质的网页体验. 此文档面向网页开发者介绍微信JS-SDK如何使用及相关注意事项. 微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包. 通过使用微信JS-SDK,网页开发者可借助微信高效地使用拍照.选图.语音.

js中的经典案例--简易万年历

html代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie

JS高级---闭包小案例

闭包小案例 普通的函数 //普通的函数 function f1() { var num = 10; num++; return num; } console.log(f1()); //11 console.log(f1()); //11 console.log(f1()); //11 函数模式的闭包 //函数模式的闭包 function f2() { var num = 10; return function () { num++; return num; } } var ff = f2();

three.js入门第一个案例

准备工作 1.运用three.js进行3d开发,其实和页面编程一样,首先需要在html文件中引入three.js.Three.js使用面向对象的方式来构建程序,它包含3个基本对象: 场景(scene), 相机(camera), 以及一个渲染器(renderer). 第一步: 引入three.js. <!DOCTYPE html> <html> <head> <meta charset=utf-8> <title>My first Three.js