hai_cheng001

jQuery整理笔记七----几个经典表单应用

1、文本框获得(失去)焦点

当文本框获得输入焦点时,将该文本框高亮显示，算不得一个应用，只是一个小技巧，可以提高用户体验。

效果图：

2、Elastic弹性文本域

Elastic是一款功能专一的表单插件，他可以控制页面内表单域()标签高度自动伸缩，以适应包含的文本。应用这个插件的时候页面需要引入jquery.elastic.source.js。<br></span></p> <p><span style="font-family:SimSun;font-size:12px;">插件下载地址：点击进入下载页面<br></span></p> <p></p> <pre><code class="language-html"><span style="font-family:SimSun;font-size:12px;"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title> New Document </title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script src="jquery-2.1.0.min.js" type="text/javascript"></script> <script src="jquery.elastic.source.js" type="text/javascript" ></script> <script type="text/javascript"> //页面加载方法 $(function(){ $("textarea").elastic();//应用弹性文本框 }) </script> </head> <body> <textarea name="" rows="2" cols="43"> 沁园春·雪北国风光，千里冰封，万里雪飘。望长城内外，惟余莽莽；大河上下，顿失滔滔。山舞银蛇，原驱蜡象，欲与天公试比高。须晴日，看红装素裹，分外妖娆。江山如此多娇，引无数英雄竞折腰。惜秦皇汉武，略输文采；唐宗宋祖，稍逊风骚。一代天骄，成吉思汗，只识弯弓射大雕。俱往矣，数风流人物，还看今朝。
效果图：

我们最初设置的标签的rows属性值为2 ,随着文本内容的增多高度会自动增加，当然了，随着内容的减少也可以高度降低的。<br></span></p> <p><span style="color:#000099;"><strong><span style="font-family:SimSun;font-size:12px;">3、Autotab自动Tab文本框<br></span></strong></span></p> <p><span style="font-family:SimSun;font-size:12px;">Autotab也是一款功能专一的表单插件，它提供了自动跳格的功能，当用户输入的字符数一旦超过已定义的最大长度，则会根据事先设置的目标自动跳转到相应元素上，省却了</span></p> <p><span style="font-family:SimSun;font-size:12px;">用户按【Tab】键的麻烦。最典型的应用就是输入IP地址、软件激活码等地方了，我们做的web项目中也有很多地方可以用到这插件，对于提高用户体验还是很有帮助的。</span></p> <p><span style="font-family:SimSun;font-size:12px;">使用时需要引入jquery.autotab.js,下载地址：点击进入下载页面<br></span></p> <p></p> <pre><code class="language-html"><span style="font-family:SimSun;font-size:12px;"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title> New Document </title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script src="jquery-2.1.0.min.js" type="text/javascript"></script> <script src="jquery.autotab.js" type="text/javascript"></script> <script type="text/javascript"> //页面加载方法 $(function(){ $('#autotab').submit(function(){ return false; }) $('#autotab :input').autotab_magic();//为页面文本框绑定autotab插件 }) </script> </head> <body> <h1>jQuery整理笔记七</h1> <h2>Autotab自动Tab文本框</h2> <form method="post" action="" id="autotab"> <label>请输入验证码： <input type="text" name="num1" id="num1" maxlength="3" size="3"> <input type="text" name="num2" id="num2" maxlength="3" size="3"> <input type="text" name="num3" id="num3" maxlength="3" size="3"> <input type="text" name="num4" id="num4" maxlength="3" size="3"> <input type="text" name="num5" id="num5" maxlength="3" size="3"> <input type="text" name="num6" id="num6" maxlength="3" size="3"> </form> </body> </html></span></code></pre> <span style="font-family:SimSun;font-size:12px;"><br> 除了可以限定输入长度外，还可以通过autotab_filter()方法限定输入的字符类型，这个方法还能过滤大写、小写、空格、字母等，具体的用到了现查吧。<br></span> <p></p> <p><span style="font-family:SimSun;font-size:12px;">如果将上面的js改成：<br></span></p> <p></p> <pre><code class="language-html"><span style="font-family:SimSun;font-size:12px;">$(function(){ $('#autotab').submit(function(){ return false; }); $('#autotab :input').autotab_magic().autotab_filter('numeric'); })</span></code></pre> <span style="font-family:SimSun;font-size:12px;">就是只能输入数字了。</span> <p></p> <p><strong><span style="color:#000099;"><span style="font-family:SimSun;font-size:12px;">4、passwordStrength密码强度指标</span></span></strong></p> <p><span style="font-family:SimSun;font-size:12px;">passwordStrength插件能够根据用户输入的密码,以图形化方式显示密码的强度。</span></p> <p></p> <pre><code class="language-html"><span style="font-family:SimSun;font-size:12px;"><!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>passwordStrength</title> <link href="css/style.css" rel="stylesheet" type="text/css" media="all" /> <script type="text/javascript" src="jquery-2.1.0.min.js"></script> <script type="text/javascript" src="passwordStrength.js"></script> <script type="text/javascript"> $(function(){ $('input[name="password"]').passwordStrength(); }) </script> <style type="text/css"> .is0{background:url(images/progressImg1.png) no-repeat 0 0;width:138px;height:7px;margin:10px 0 0 104px;} .is10{background-position:0 -7px;} .is20{background-position:0 -14px;} .is30{background-position:0 -21px;} .is40{background-position:0 -28px;} .is50{background-position:0 -35px;} .is60{background-position:0 -42px;} .is70{background-position:0 -49px;} .is80{background-position:0 -56px;} .is90{background-position:0 -63px;} .is100{background-position:0 -70px;} #autotab input { width:138px; } </style> </head> <body> <h1>jQuery整理笔记七</h1> <h2>表单开发（Forms）</h2> <hr /> <h3>passwordStrength密码强度指标</h3> <form action="" method="post" id="autotab" class="p1"> <label>请输入密码： <input type="password" name="password" /> <div id="passwordStrengthDiv" class="is0"></div> </label> </form> </body> </html></span></code></pre> <span style="font-family:SimSun;font-size:12px;">上例用到一个图片：</span> <p></p> <p><span style="font-family:SimSun;font-size:12px;"><img src="http://img.e-com-net.com/image/info8/619bd51cb8ef42e28caf1f7f8fb60af2.png" alt="" width="0" height="0"></span></p> <p><span style="font-family:SimSun;font-size:12px;">执行效果图：</span></p> <p><span style="font-family:SimSun;font-size:12px;"><img src="http://img.e-com-net.com/image/info8/4e0fd2817dfb4b7f8e3a3c5aa91dacbd.jpg" alt="" width="0" height="0"></span></p> <p><strong><span style="color:#000099;"><span style="font-family:SimSun;font-size:12px;">5、formToWizard表单填充向导</span></span></strong></p> <p><span style="font-family:SimSun;font-size:12px;">这个是什么意思呢？其实我们实际见的也很多，有很多网站填写注册信息的时候是分步进行的，比方说，先填写个人信息，然后再填写工作信息...然后一起提交。这就避免了庞</span></p> <p><span style="font-family:SimSun;font-size:12px;">大的信息量都在一个页面上进行填写。</span></p> <p><span style="font-family:SimSun;font-size:12px;">formToWizard就是解决这个问题的一个小插件，插件下载地址:点击进入下载页面</span></p> <p></p> <pre><code class="language-html"><span style="font-family:SimSun;font-size:12px;"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title> New Document </title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script src="jquery-2.1.0.min.js" type="text/javascript"></script> <script type="text/javascript" src="formToWizard.js"></script> <script type="text/javascript"> //页面加载方法 $(function(){ $("#form1").formToWizard({ submitButton: 'SaveAccount' }) }) </script> <style type="text/css"> #wrap { margin:1em 4em; font-size:12px; padding:1em 1em; border:solid 1px #fff; } fieldset { border:none; width:320px; } legend { font-size:18px; margin:0px; padding:10px 0px; color:#b0232a; font-weight:bold; } label { display:block; margin:15px 0 5px; } input[type=text], input[type=password] { width:300px; padding:5px; border:solid 1px #000; } .prev, .next { background-color:#b0232a; padding:5px 10px; color:#fff; text-decoration:none; } .prev:hover, .next:hover { background-color:#000; text-decoration:none; } .prev { float:left; } .next { float:right; } #steps { list-style:none; width:100%; overflow:hidden; margin:0px; padding:0px; } #steps li { font-size:24px; float:left; padding:10px; color:#b0b1b3; } #steps li span { font-size:11px; display:block; } #steps li.current { color:#000; } #makeWizard { background-color:#b0232a; color:#fff; padding:5px 10px; text-decoration:none; font-size:18px; } #makeWizard:hover { background-color:#000; } </style> </head> <body> <div id="wrap"> <form id="form1" action=""> <fieldset> <legend>登录信息</legend> <label for="Name">昵称</label> <input id="Name" type="text" /> <label for="Email">Email</label> <input id="Email" type="text" /> <label for="Password">密码</label> <input id="Password" type="password" /> </fieldset> <fieldset> <legend>公司信息</legend> <label for="CompanyName">公司名称</label> <input id="CompanyName" type="text" /> <label for="Website">公司网址</label> <input id="Website" type="text" /> <label for="CompanyEmail">公司邮箱</label> <input id="CompanyEmail" type="text" /> </fieldset> <fieldset> <legend>个人信息</legend> <label for="NameOnCard">真实姓名</label> <input id="NameOnCard" type="text" /> <label for="CardNumber">身份证号</label> <input id="CardNumber" type="text" /> <label for="CreditcardMonth">发卡日期</label> <select id="CreditcardMonth"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> <option value="11">11</option> <option value="12">12</option> </select> <select id="CreditcardYear"> <option value="2009">2009</option> <option value="2010">2010</option> <option value="2011">2011</option> </select> <label for="Address1">地址1</label> <input id="Address1" type="text" /> <label for="Address2">地址2</label> <input id="Address2" type="text" /> <label for="City">城市</label> <input id="City" type="text" /> <label for="Country">国家</label> <select id="Country"> <option value="CA">Canada</option> <option value="US">United States of America</option> <option value="GB">United Kingdom (Great Britain)</option> <option value="AU">Australia</option> <option value="JP">Japan</option> </select> </fieldset> <div> <input id="SaveAccount" type="button" value="提交表单" /> </div> </div> </form> </body> </html> </span></code></pre> <span style="font-family:SimSun;font-size:12px;"><br> 效果图：</span> <p></p> <p><span style="font-family:SimSun;font-size:12px;"><img src="http://img.e-com-net.com/image/info8/f5d9a8b527be4e9f8363502caa8d9e7f.jpg" alt="" width="0" height="0"><img src="http://img.e-com-net.com/image/info8/4ece6f46985e482898f2b29f9e807202.jpg" alt="" width="0" height="0"></span></p> <p><span style="font-family:SimSun;font-size:12px;"><img src="http://img.e-com-net.com/image/info8/6743108771d44d9bbad7df8b6d29af74.jpg" alt="" width="0" height="0"></span></p> <p><span style="font-family:SimSun;font-size:12px;">6、checkbox复选框(全选反选等操作)</span></p> <p><span style="font-family:SimSun;font-size:12px;">以前经常用，不说了。</span></p> <p><strong><span style="color:#000099;"><span style="font-family:SimSun;font-size:12px;">7、下拉框的应用</span></span></strong></p> <p><span style="font-family:SimSun;font-size:12px;">这回先看个图：</span></p> <p><span style="font-family:SimSun;font-size:12px;"><img src="http://img.e-com-net.com/image/info8/bca41f9c03804bbab6b80cfaf3e538ad.jpg" alt="" width="0" height="0"></span></p> <p><span style="font-family:SimSun;font-size:12px;">大家肯定都见过类似效果的网页，怎么实现的呢,代码很简单：</span></p> <p></p> <pre><code class="language-html"><span style="font-family:SimSun;font-size:12px;"><!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></title> <style type="text/css"> * { margin:0; padding:0; } div.centent { float:left; text-align: center; margin: 10px; } span { display:block; margin:2px 2px; padding:4px 10px; background:#898989; cursor:pointer; font-size:12px; color:white; } </style>  <script src="jquery-2.1.0.min.js" type="text/javascript"></script> <script type="text/javascript"> $(function(){ //移到右边 $('#add').click(function() { //获取选中的选项，删除并追加给对方 $('#select1 option:selected').appendTo('#select2'); }); //移到左边 $('#remove').click(function() { $('#select2 option:selected').appendTo('#select1'); }); //全部移到右边 $('#add_all').click(function() { //获取全部的选项,删除并追加给对方 $('#select1 option').appendTo('#select2'); }); //全部移到左边 $('#remove_all').click(function() { $('#select2 option').appendTo('#select1'); }); //双击选项 $('#select1').dblclick(function(){ //绑定双击事件 //获取全部的选项,删除并追加给对方 $("option:selected",this).appendTo('#select2'); //追加给对方 }); //双击选项 $('#select2').dblclick(function(){ $("option:selected",this).appendTo('#select1'); }); }); </script> </head> <body> <div class="centent"> <select multiple="multiple" id="select1" style="width:100px;height:160px;"> <option value="1">曹操</option> <option value="2">曹昂</option> <option value="3">曹丕</option> <option value="4">曹彰</option> <option value="5">曹植</option> <option value="6">曹熊</option> <option value="7">曹仁</option> <option value="8">曹洪</option> <option value="9">曹休</option> <option value="10">曹真</option> <option value="11">曹爽</option> </select> <div> <span id="add" >选中添加到右边>></span> <span id="add_all" >全部添加到右边>></span> </div> </div> <div class="centent"> <select multiple="multiple" id="select2" style="width: 100px;height:160px;"> <option value="12">曹芳</option> </select> <div> <span id="remove"><<选中删除到左边</span> <span id="remove_all"><<全部删除到左边</span> </div> </div> </body> </html></span></code></pre> <span style="font-family:SimSun;font-size:12px;"><br> 代码实现的功能：</span> <p></p> <p><span style="font-family:SimSun;font-size:12px;">1)、将选中的选项添加给对方</span></p> <p><span style="font-family:SimSun;font-size:12px;">2)、将全部选项添加给对方</span></p> <p><span style="font-family:SimSun;font-size:12px;">3)、双击某个选项将其添加给对方<br><br><br></span></p> <p><span style="font-family:SimSun;font-size:12px;"><br></span></p> <p><span style="font-family:SimSun;font-size:12px;"><br></span></p> <p><br></p> </div> </div> </div> </div> </div>  <div id="SOHUCS" sid="1287767982889545728"></div> <script type="text/javascript" src="/views/front/js/chanyan.js"></script>  <div class="youdao-fixed-ad" id="detail_ad_bottom"></div> </div> <div class="col-md-3"> <div class="row" id="ad">  <div id="right-1" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_1"> </div> </div>  <div id="right-2" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_2"></div> </div>  <div id="right-3" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_3"></div> </div> </div> </div> </div> </div> </div> <div class="container"> <h4 class="pt20 mb15 mt0 border-top">你可能感兴趣的:(jQuery,jQuery)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1835295766747377664.htm" title="C# 开发教程-入门基础" target="_blank">C# 开发教程-入门基础</a> <span class="text-muted">天马3798</span> <a class="tag" taget="_blank" href="/search/%E6%95%99%E7%A8%8B%E7%B3%BB%E5%88%97%E6%95%B4%E7%90%86/1.htm">教程系列整理</a><a class="tag" taget="_blank" href="/search/c%23/1.htm">c#</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>1.C#简介、环境，程序结构2.C#基本语法，变量，控制局域，数据类型，类型转换3.C#数组、循环，Linq4.C#类，封装，方法5.C#枚举、字符串6.C#面相对象，继承，封装，多态7.C#特性、属性、反射、索引器8.C#委托，事件，集合，泛型9.C#匿名方法10.C#多线程更多：JQuery开发教程入门基础Vue开发基础入门教程Vue开发高级学习教程</div> </li> <li><a href="/article/1835131984087707648.htm" title="html 删除事件,html 事件的添加和删除" target="_blank">html 删除事件,html 事件的添加和删除</a> <span class="text-muted">列蒂齐亚</span> <a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/%E5%88%A0%E9%99%A4%E4%BA%8B%E4%BB%B6/1.htm">删除事件</a> <div>jQuery在jQuery1.7版本中bind()unbind(),live()die(),on()off(),delegate()下面我们给li元素添加事件bind()旧版写法:事件不能适用脚本创建的新元素live()旧版写法:适用脚本创建的新元素写法，但性能极不好on()新版写法，事件不能适用脚本创建的新元素(接收多个函数绑定)这三种方法都是基于要给添加事件的元素本身。$("ulli").bi</div> </li> <li><a href="/article/1835118358262018048.htm" title="动态生成的html元素绑定click事件" target="_blank">动态生成的html元素绑定click事件</a> <span class="text-muted">.NET跨平台</span> <a class="tag" taget="_blank" href="/search/Jquery%E5%8F%8A%E5%85%B6%E7%BB%84%E4%BB%B6/1.htm">Jquery及其组件</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a> <div>第一篇博客，开启技术博客的生涯，欢迎大家批评指教（坚信妹子也可以做好程序猿）今天想说帮公司做项目的时候遇到的一个小问题，动态添加html元素以后再去事件监听出问题。在实际开发中会遇到要给动态生成的html元素绑定触发事件的情况。就是上面的一张表格要动态实现添加行，然后序列号还要随着增加，当删除的时候序列号依旧是按顺序排列。刚开始使用jQuery的on方法来解决，但是发现一个问题会出现事件绑定很多次</div> </li> <li><a href="/article/1834998844144840704.htm" title="前端页面实现table可拖动改变列宽" target="_blank">前端页面实现table可拖动改变列宽</a> <span class="text-muted">牧码人</span> <a class="tag" taget="_blank" href="/search/js/1.htm">js</a><a class="tag" taget="_blank" href="/search/jQuery/1.htm">jQuery</a><a class="tag" taget="_blank" href="/search/js/1.htm">js</a><a class="tag" taget="_blank" href="/search/%E8%A1%A8%E6%A0%BC%E6%8B%96%E5%8A%A8/1.htm">表格拖动</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/colResizable/1.htm">colResizable</a> <div>此处实现页面的table表格可以自由拖动列宽，拖动时表格内文字不换行，超出部分以...代替，实现步骤如下：1.首先引入jQuery和colResizable的js文件，colResizable支持表格拖动改变列宽，但基于jQuery，（1）colResizable可以去：http://www.bacubacu.com/colresizable/#rangeSlider下载（2）引入文件：2.编写j</div> </li> <li><a href="/article/1834780371229700096.htm" title="关于jquery的on(“click”,function(){}),事件绑定无效" target="_blank">关于jquery的on(“click”,function(){}),事件绑定无效</a> <span class="text-muted">微特尔普拉斯</span> <a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a> <div>之前在做jquery时,遇到一个问题,就是我在append一个给啊标签绑定click点击事件时不起作用,jquery的版本时3.4.1,也找不到起的错误.就是没触发:$(self).find(".comment-action.cancel").off("click");//console.log("点击了取消回复的按钮!");$(self).find(".comment-action.cancel</div> </li> <li><a href="/article/1834333573889486848.htm" title="（hilo）摇钱树项目梳理" target="_blank">（hilo）摇钱树项目梳理</a> <span class="text-muted">大胡子111</span> <div>摇钱树项目用到了：1.jquery（js库）2.hilo.js(游戏框架)3.tida.js（淘宝相关api--要在淘宝中实现摇一摇功能）4.原生陀螺仪（因为要在微信中实现摇一摇功能）5.静态文件资源预加载项目组成部分：1.摇钱树2.摇一摇按钮3.树下礼包4.游戏标题5.树上的红包和金币6.音乐7.获奖记录7.活动规则（活动说明/玩法介绍）8.红包雨下落9.地上红包10.获奖/失败层11.玩法介绍</div> </li> <li><a href="/article/1834298842934243328.htm" title="jQuery Easyui 源码分析之combo组件" target="_blank">jQuery Easyui 源码分析之combo组件</a> <span class="text-muted">90后北京程序员</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF-easyui/1.htm">前端-easyui</a><a class="tag" taget="_blank" href="/search/easyui%E4%B9%8Bcombobox/1.htm">easyui之combobox</a> <div>/***jQueryEasyUI1.3.1*该源码完全由压缩码翻译而来，并非网络上放出的源码，请勿索要。*/(function($){functionsetSize(target,width){varopts=$.data(target,"combo").options;varcombo=$.data(target,"combo").combo;varpanel=$.data(target,"co</div> </li> <li><a href="/article/1834077500251140096.htm" title="jquery打包到webpack项目" target="_blank">jquery打包到webpack项目</a> <span class="text-muted">不cong明的亚子</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/webpack/1.htm">webpack</a><a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>入口文件—index.jswindow.$=require('jquery')webpack.config.jsconstwebpack=require('webpack')module.exports={...plugins:[...newwebpack.ProvidePlugin({$:'jquery',jQuery:'jquery'})...]...}</div> </li> <li><a href="/article/1833982338229432320.htm" title="通过前端实现导出生成pdf文件并下载" target="_blank">通过前端实现导出生成pdf文件并下载</a> <span class="text-muted">银河小铁皮</span> <a class="tag" taget="_blank" href="/search/vue/1.htm">vue</a><a class="tag" taget="_blank" href="/search/%E5%8E%9F%E7%94%9FJS/1.htm">原生JS</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a> <div>通过前端实现导出生成pdf文件并下载使用jspdf.js+html2canvas插件，实现前端生成pdf并下载的功能步骤如下1、先通过npm安装插件npminstalljspdf.jsnpminstallhtml2canvas2、单独在utils文件夹下，新建文件，存放处理代码/*eslint-disable*///不使用JQuery版的importhtml2canvasfrom'html2can</div> </li> <li><a href="/article/1833961665184493568.htm" title="java计算机毕业设计Vue潍坊学院宿舍管理系统设计与实现MyBatis+系统+LW文档+源码+调试部署" target="_blank">java计算机毕业设计Vue潍坊学院宿舍管理系统设计与实现MyBatis+系统+LW文档+源码+调试部署</a> <span class="text-muted">一梵sheji288</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/mybatis/1.htm">mybatis</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a> <div>java计算机毕业设计Vue潍坊学院宿舍管理系统设计与实现MyBatis+系统+LW文档+源码+调试部署java计算机毕业设计Vue潍坊学院宿舍管理系统设计与实现MyBatis+系统+LW文档+源码+调试部署本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Win10、</div> </li> <li><a href="/article/1833864459446218752.htm" title="TypeScript---类型批注" target="_blank">TypeScript---类型批注</a> <span class="text-muted">Anglie</span> <div>TS通过类型批注提供静态类型，方便在编译时启动类型检查，这不是必须的，甚至可以被忽略，去使用js常规的动态类型。基本类型的批注是number,bool,string,弱类型或动态类型的结构可以是任意类型。将类型批注导出到一个单独的文件，方便使用类型已经被编译成为js的ts脚本的类型信息可用。批注可以为一个现有的js库声明。就像已经为node.js和jquery.js所做的那样。当没有给出类型时，T</div> </li> <li><a href="/article/1833759939974230016.htm" title="基于Java毕业设计新锐台球厅管理系统源码+系统+mysql+lw文档+部署软件" target="_blank">基于Java毕业设计新锐台球厅管理系统源码+系统+mysql+lw文档+部署软件</a> <span class="text-muted">练练科技</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E8%AF%BE%E7%A8%8B%E8%AE%BE%E8%AE%A1/1.htm">课程设计</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div>基于Java毕业设计新锐台球厅管理系统源码+系统+mysql+lw文档+部署软件基于Java毕业设计新锐台球厅管理系统源码+系统+mysql+lw文档+部署软件本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Win10、JDK1.8数据库：MySQL5.7/8.0源码</div> </li> <li><a href="/article/1833733075486470144.htm" title="java计算机毕业设计高校学生资助管理信息系统源码+mysql数据库+系统+lw文档+部署" target="_blank">java计算机毕业设计高校学生资助管理信息系统源码+mysql数据库+系统+lw文档+部署</a> <span class="text-muted">鸿源网络</span> <a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>java计算机毕业设计高校学生资助管理信息系统源码+mysql数据库+系统+lw文档+部署java计算机毕业设计高校学生资助管理信息系统源码+mysql数据库+系统+lw文档+部署本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Win10、JDK1.8数据库：MySQ</div> </li> <li><a href="/article/1833722103464030208.htm" title="基于JAVA高校毕业就业管理系统计算机毕业设计源码+数据库+lw文档+系统+部署" target="_blank">基于JAVA高校毕业就业管理系统计算机毕业设计源码+数据库+lw文档+系统+部署</a> <span class="text-muted">源新网络</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>基于JAVA高校毕业就业管理系统计算机毕业设计源码+数据库+lw文档+系统+部署基于JAVA高校毕业就业管理系统计算机毕业设计源码+数据库+lw文档+系统+部署本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Win10、JDK1.8数据库：MySQL5.7/8.0源码</div> </li> <li><a href="/article/1833653399816597504.htm" title="jQuery选择器" target="_blank">jQuery选择器</a> <span class="text-muted">VaporGas</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a> <div>jQuery选择器jQuery选择器类似于CSS选择器，用来选取网页中的元素$("h3").css("background","#09F");代码分析：获取并设置网页中所有元素的背景“h3”为选择器语法，必须放在$()中$(“h3”)返回jQuery对象.css()是为jQuery对象设置样式的方法jQuery选择器分类jQuery选择器功能强大，种类也很多，分类如下：类CSS选择器基本选择器层次</div> </li> <li><a href="/article/1833645082776006656.htm" title="Java架构师学习路线" target="_blank">Java架构师学习路线</a> <span class="text-muted">网络全息测量</span> <a class="tag" taget="_blank" href="/search/%E5%BF%83%E5%BE%97%E4%BD%93%E4%BC%9A/1.htm">心得体会</a> <div>(1)第一步：研究spring,hibernate。通过研究jeecms开源框架。也同时学习css,html,javascript,jquery.以前都学习过，不过没有系统学习过，现在必须系统学习。同时看cms相关的论文。然后，改造jeecms能够改为自己的一个开源框架，以后开发cms系统都用我自己开发的框架，作为第一阶段的成果。(2)第二步：学习开源工作流引擎Activiti5，jbpm4.4以</div> </li> <li><a href="/article/1833596914633895936.htm" title="AJAX实时表单验证系统" target="_blank">AJAX实时表单验证系统</a> <span class="text-muted">三年九班蓝同学</span> <div>本文还有配套的精品资源，点击获取简介：在网页开发中，"ajax验证表单"是一项关键任务，确保数据符合格式和规则，提升数据质量和用户体验。本应用通过使用JavaScript和XMLHttpRequest对象实现后台验证，无需页面刷新。它包括前端验证、事件处理、Ajax调用、服务器端处理、响应处理、用户体验和安全性等关键步骤，以jQuery库简化开发流程，创建高效、安全的表单验证系统。1.表单验证的重</div> </li> <li><a href="/article/1833573338975399936.htm" title="利用jQuery框架的ajax请求获取json格式的数据" target="_blank">利用jQuery框架的ajax请求获取json格式的数据</a> <span class="text-muted">听海边涛声</span> <a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a><a class="tag" taget="_blank" href="/search/ajax/1.htm">ajax</a><a class="tag" taget="_blank" href="/search/json/1.htm">json</a> <div>Document$('#btn').click(()=>{$.get('http://localhost:8080/jsajaxproject/jquery_json','username=tom&age=20',(data)=>{//alert(data)alert(data.name+'\t'+data.age+'\t'+data.gender)},'json')})点击按钮：</div> </li> <li><a href="/article/1832954303036354560.htm" title="jquery加载页面的方法(页面加载完成就执行)" target="_blank">jquery加载页面的方法(页面加载完成就执行)</a> <span class="text-muted">JaosnY</span> <a class="tag" taget="_blank" href="/search/JQuery/1.htm">JQuery</a><a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a><a class="tag" taget="_blank" href="/search/%E8%87%AA%E5%8A%A8%E5%8A%A0%E8%BD%BD/1.htm">自动加载</a> <div>转自http://www.jb51.net/article/27444.htmjquery加载页面的方法(页面加载完成就执行),建议大家看下windows.onload与$(document).ready之间的区别。1、$(function(){$("#a").click(function(){//addingyourcodehere});});2、$(document).ready(functi</div> </li> <li><a href="/article/1832903408051384320.htm" title="jquery事件" target="_blank">jquery事件</a> <span class="text-muted">上心心上</span> <div>jquery事件事件函数列表：blur()元素失去焦点focus()元素获得焦点change()表单元素的值发生变化click()鼠标单击dblclick()鼠标双击mouseover()鼠标进入（进入子元素也触发）mouseout()鼠标离开（离开子元素也触发）mouseenter()鼠标进入（进入子元素不触发）mouseleave()鼠标离开（离开子元素不触发）hover()同时为mousee</div> </li> <li><a href="/article/1832861643386744832.htm" title="node模块" target="_blank">node模块</a> <span class="text-muted">weiweiweb888</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/bootstrap/1.htm">bootstrap</a> <div>模块系统模块化介绍传统开发的问题随着项目的扩大，然后代码就越来越庞大，如果没有很好的规划，后期维护非常复杂（甚至就维护不了）。比如：前端html中有很多特效会依赖js文件。比如：index.html:bootstrap以上就是一个依赖关系，bootstrap依赖于jquery。先引入jquery后引入bootstrap。而且随着项目的扩大，我们的html页面也就随之增加，并且每一个html页面都会</div> </li> <li><a href="/article/1832660057762918400.htm" title="jQuery中的ajax通信技术的讲解" target="_blank">jQuery中的ajax通信技术的讲解</a> <span class="text-muted">盛夏绽放</span> <a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a><a class="tag" taget="_blank" href="/search/ajax/1.htm">ajax</a><a class="tag" taget="_blank" href="/search/okhttp/1.htm">okhttp</a> <div>jQuery提供了多种方法来处理AJAX请求，这些方法简化了异步请求的创建和处理。以下是一些常用的jQueryAJAX方法及其演示：1.$.ajax()（1）解释这个方法是最基础也是最强大的AJAX方法，它可以接受一个配置对象来构建并发送HTTP请求。（2）示例：这是一个GET请求模版$.ajax({url:'https://api.example.com/data',//请求的URL地址type</div> </li> <li><a href="/article/1832514192314298368.htm" title="记录-小程序720°VR（跳转H5页面实现）" target="_blank">记录-小程序720°VR（跳转H5页面实现）</a> <span class="text-muted">久违的小技巧</span> <a class="tag" taget="_blank" href="/search/%E5%B0%8F%E7%A8%8B%E5%BA%8F/1.htm">小程序</a><a class="tag" taget="_blank" href="/search/%E5%B0%8F%E7%A8%8B%E5%BA%8F/1.htm">小程序</a><a class="tag" taget="_blank" href="/search/vr/1.htm">vr</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>全景浏览提前准备1拍照支架/照片合成软件（KolorAutopanoGiga4.0）或者全景相机2pannellum（pannellum是一个轻量级、免费和开源的Web全景查看器。它使用HTML5、CSS3、JavaScript和WebGL构建，没有插件。）3H5页面引入pannellum.js/css文件，swiper/jquery文件（因为需要在全景图底部显示可切换图片，与dom操作/ajax</div> </li> <li><a href="/article/1832490492303077376.htm" title="HTML表格" target="_blank">HTML表格</a> <span class="text-muted">一壶浊酒..</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91/1.htm">前端开发</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>table,tr,td{border:lpxsolidsilver;}表格标题表头单元格HTMLCSSJavaScriptJQuery标准单元格合并行：rowspan在HTML中，我们可以使用rowspan属性来合并行。所谓的合并行，指的是将“纵向的N个单元格”合并。rowspan属性table,tr,td{border:1pxsolidsilver;}姓名:小明喜欢水果:苹果香蕉合并列：cols</div> </li> <li><a href="/article/1832480529593757696.htm" title="前端篇—ajax" target="_blank">前端篇—ajax</a> <span class="text-muted">wolf67</span> <a class="tag" taget="_blank" href="/search/Django/1.htm">Django</a><a class="tag" taget="_blank" href="/search/django/1.htm">django</a><a class="tag" taget="_blank" href="/search/js/1.htm">js</a><a class="tag" taget="_blank" href="/search/ajax/1.htm">ajax</a> <div>文章目录前言一、基于JS的ajax实现1.1基础1.2完整代码示例1.3应用二、JSON和JSONP2.1什么是JSON2.2JSON语法2.3应用2.4json与django交互2.5json与xml比较三、基于jQuery的ajax实现3.1基础方法3.2快捷方法用法示例四、跨域请求4.1同源机制4.2jsonp的js实现（未完成）4.3jsonp的jQuery实现4.4jsonp的ajax实</div> </li> <li><a href="/article/1832441318006157312.htm" title="菜谱推荐系统(前台android原生,后台java,SSH,mysql)" target="_blank">菜谱推荐系统(前台android原生,后台java,SSH,mysql)</a> <span class="text-muted">weixingliang_123</span> <a class="tag" taget="_blank" href="/search/%E8%8F%9C%E8%B0%B1/1.htm">菜谱</a><a class="tag" taget="_blank" href="/search/%E9%A3%9F%E8%B0%B1/1.htm">食谱</a><a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E7%BC%96%E7%A8%8B%E8%AF%AD%E8%A8%80/1.htm">编程语言</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div>Android菜谱推荐系统(前台android原生,后台java,SSH,mysql)(程序代码,MySQL数据库)【运行环境】MyEclipse(后台)Eclipse(前台)JDK1.7tomcat7【技术栈】JAVA,JSP,mvc,SSH,MYSQL,HTML,CSS,JAVASCRIPT,JQUERY,android原生【项目包含内容】【下载全套源码】【项目功能介绍】</div> </li> <li><a href="/article/1832177192491118592.htm" title="【jQuery】前端八股文面试题" target="_blank">【jQuery】前端八股文面试题</a> <span class="text-muted">菜鸟una</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E5%85%AB%E8%82%A1%E6%96%87%E9%9D%A2%E8%AF%95%E9%A2%98/1.htm">前端八股文面试题</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>jQuery这个问的没有那么多，暂时我被问到的就这几个。大家可以直接订阅专栏。文章目录jQuery1.jQuery常见的方法有哪几个？2.在jQuery中，常见使用委托的事件有哪些？1）点击事件（click）2）鼠标悬停事件（mouseenter和mouseleave）3）表单提交事件（submit）4）输入框变化事件（change）3.在jQuery中，常见的鼠标事件方法有哪些？1）click（</div> </li> <li><a href="/article/1832157526892834816.htm" title="jQuery第八章原生ajax" target="_blank">jQuery第八章原生ajax</a> <span class="text-muted">小涛涛啊！</span> <a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a><a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a> <div>第八章原生ajax1：ajax的概念AJAX=AsynchronousJavaScriptandXML（异步的JavaScript和XML）。AJAX不是新的编程语言，而是一种使用现有标准的新方法。*AJAX异步请求数据。什么是AJAX？AJAX=异步JavaScript和XML。AJAX是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换，AJAX可以使网页实现异步更新。这意味着</div> </li> <li><a href="/article/1832157398832345088.htm" title="java计算机毕业设计生产管理系统源代码+数据库+系统+lw文档" target="_blank">java计算机毕业设计生产管理系统源代码+数据库+系统+lw文档</a> <span class="text-muted">影伴设计</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>java计算机毕业设计生产管理系统源代码+数据库+系统+lw文档java计算机毕业设计生产管理系统源代码+数据库+系统+lw文档本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Win10、JDK1.8数据库：MySQL5.7/8.0源码地址：https://pan.b</div> </li> <li><a href="/article/1832147439671406592.htm" title="第三章：发送AJAX请求的几种方式" target="_blank">第三章：发送AJAX请求的几种方式</a> <span class="text-muted">Muko_0x7d2</span> <a class="tag" taget="_blank" href="/search/AJAX/1.htm">AJAX</a><a class="tag" taget="_blank" href="/search/ajax/1.htm">ajax</a> <div>1.jquery发送Ajax请求1.1引进jQuery资源进入bootcdn.cn网站搜索jQuery复制script标签放到目标html文件head标签中添加跨源的属性的设置crossorigin="anonymous"1.2jQuery发送请求的四个参数：url参数（可以没有）函数响应体类型（一般为json）1.3GET请求请求类型为get参数在名称里面//1.发送GET请求$('button</div> </li> <li><a href="/article/29.htm" title="SQL的各种连接查询" target="_blank">SQL的各种连接查询</a> <span class="text-muted">xieke90</span> <a class="tag" taget="_blank" href="/search/UNION+ALL/1.htm">UNION ALL</a><a class="tag" taget="_blank" href="/search/UNION/1.htm">UNION</a><a class="tag" taget="_blank" href="/search/%E5%A4%96%E8%BF%9E%E6%8E%A5/1.htm">外连接</a><a class="tag" taget="_blank" href="/search/%E5%86%85%E8%BF%9E%E6%8E%A5/1.htm">内连接</a><a class="tag" taget="_blank" href="/search/JOIN/1.htm">JOIN</a> <div>一、内连接概念：内连接就是使用比较运算符根据每个表共有的列的值匹配两个表中的行。内连接（join 或者inner join ） SQL语法： select * fron</div> </li> <li><a href="/article/156.htm" title="java编程思想--复用类" target="_blank">java编程思想--复用类</a> <span class="text-muted">百合不是茶</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E7%BB%A7%E6%89%BF/1.htm">继承</a><a class="tag" taget="_blank" href="/search/%E4%BB%A3%E7%90%86/1.htm">代理</a><a class="tag" taget="_blank" href="/search/%E7%BB%84%E5%90%88/1.htm">组合</a><a class="tag" taget="_blank" href="/search/final%E7%B1%BB/1.htm">final类</a> <div> 复用类看着标题都不知道是什么,再加上java编程思想翻译的比价难懂,所以知道现在才看这本软件界的奇书一:组合语法:就是将对象的引用放到新类中即可代码: package com.wj.reuse; /** * * @author Administrator 组</div> </li> <li><a href="/article/283.htm" title="[开源与生态系统]国产CPU的生态系统" target="_blank">[开源与生态系统]国产CPU的生态系统</a> <span class="text-muted">comsci</span> <a class="tag" taget="_blank" href="/search/cpu/1.htm">cpu</a> <div> 计算机要从娃娃抓起...而孩子最喜欢玩游戏.... 要让国产CPU在国内市场形成自己的生态系统和产业链,国家和企业就不能够忘记游戏这个非常关键的环节.... 投入一些资金和资源,人力和政策,让游</div> </li> <li><a href="/article/410.htm" title="JVM内存区域划分Eden Space、Survivor Space、Tenured Gen，Perm Gen解释" target="_blank">JVM内存区域划分Eden Space、Survivor Space、Tenured Gen，Perm Gen解释</a> <span class="text-muted">商人shang</span> <a class="tag" taget="_blank" href="/search/jvm%E5%86%85%E5%AD%98/1.htm">jvm内存</a> <div>jvm区域总体分两类，heap区和非heap区。heap区又分：Eden Space（伊甸园）、Survivor Space(幸存者区)、Tenured Gen（老年代-养老区）。非heap区又分：Code Cache(代码缓存区)、Perm Gen（永久代）、Jvm Stack(java虚拟机栈)、Local Method Statck(本地方法栈)。 HotSpot虚拟机GC算法采用分代收</div> </li> <li><a href="/article/537.htm" title="页面上调用 QQ" target="_blank">页面上调用 QQ</a> <span class="text-muted">oloz</span> <a class="tag" taget="_blank" href="/search/qq/1.htm">qq</a> <div><A href="tencent://message/?uin=707321921&Site=有事Q我&Menu=yes"> <img style="border:0px;" src=http://wpa.qq.com/pa?p=1:707321921:1></a></div> </li> <li><a href="/article/664.htm" title="一些问题" target="_blank">一些问题</a> <span class="text-muted">文强chu</span> <a class="tag" taget="_blank" href="/search/%E9%97%AE%E9%A2%98/1.htm">问题</a> <div>1.eclipse 导出 doc 出现“The Javadoc command does not exist.” javadoc command 选择 jdk/bin/javadoc.exe 2.tomcate 配置 web 项目 ..... SQL:3.mysql * 必须得放前面否则 select&nbs</div> </li> <li><a href="/article/791.htm" title="生活没有安全感" target="_blank">生活没有安全感</a> <span class="text-muted">小桔子</span> <a class="tag" taget="_blank" href="/search/%E7%94%9F%E6%B4%BB/1.htm">生活</a><a class="tag" taget="_blank" href="/search/%E5%AD%A4%E7%8B%AC/1.htm">孤独</a><a class="tag" taget="_blank" href="/search/%E5%AE%89%E5%85%A8%E6%84%9F/1.htm">安全感</a> <div> 圈子好小，身边朋友没几个，交心的更是少之又少。在深圳，除了男朋友，没几个亲密的人。不知不觉男朋友成了唯一的依靠，毫不夸张的说，业余生活的全部。现在感情好，也很幸福的。但是说不准难免人心会变嘛，不发生什么大家都乐融融，发生什么很难处理。我想说如果不幸被分手(无论原因如何)，生活难免变化很大，在深圳，我没交心的朋友。明</div> </li> <li><a href="/article/918.htm" title="php 基础语法" target="_blank">php 基础语法</a> <span class="text-muted">aichenglong</span> <a class="tag" taget="_blank" href="/search/php+%E5%9F%BA%E6%9C%AC%E8%AF%AD%E6%B3%95/1.htm">php 基本语法</a> <div>1 .1 php变量必须以$开头 <?php $a=” b”; echo ?> 1 .2 php基本数据库类型 Integer float/double Boolean string 1 .3 复合数据类型数组array和对象 object 1 .4 特殊数据类型 null 资源类型(resource) $co</div> </li> <li><a href="/article/1045.htm" title="mybatis tools 配置详解" target="_blank">mybatis tools 配置详解</a> <span class="text-muted">AILIKES</span> <a class="tag" taget="_blank" href="/search/mybatis/1.htm">mybatis</a> <div>MyBatis Generator中文文档 MyBatis Generator中文文档地址： http://generator.sturgeon.mopaas.com/ 该中文文档由于尽可能和原文内容一致，所以有些地方如果不熟悉，看中文版的文档的也会有一定的障碍，所以本章根据该中文文档以及实际应用，使用通俗的语言来讲解详细的配置。本文使用Markdown进行编辑，但是博客显示效</div> </li> <li><a href="/article/1172.htm" title="继承与多态的探讨" target="_blank">继承与多态的探讨</a> <span class="text-muted">百合不是茶</span> <a class="tag" taget="_blank" href="/search/JAVA%E9%9D%A2%E5%90%91%E5%AF%B9%E8%B1%A1+%E7%BB%A7%E6%89%BF+%E5%AF%B9%E8%B1%A1/1.htm">JAVA面向对象继承对象</a> <div>继承 extends 多态继承是面向对象最经常使用的特征之一：继承语法是通过继承发、基类的域和方法 //继承就是从现有的类中生成一个新的类，这个新类拥有现有类的所有extends是使用继承的关键字：在A类中定义属性和方法； class A{ //定义属性 int age； //定义方法 public void go</div> </li> <li><a href="/article/1299.htm" title="JS的undefined与null的实例" target="_blank">JS的undefined与null的实例</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a> <div><form name="theform" id="theform"> </form> <script language="javascript"> var a alert(typeof(b)); //这里提示undefined if(theform.datas</div> </li> <li><a href="/article/1426.htm" title="TDD实践（一）" target="_blank">TDD实践（一）</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E6%95%8F%E6%8D%B7/1.htm">敏捷</a><a class="tag" taget="_blank" href="/search/TDD/1.htm">TDD</a> <div>一.TDD概述 TDD：测试驱动开发，它的基本思想就是在开发功能代码之前，先编写测试代码。也就是说在明确要开发某个功能后，首先思考如何对这个功能进行测试，并完成测试代码的编写，然后编写相关的代码满足这些测试用例。然后循环进行添加其他功能，直到完全部功能的开发。 </div> </li> <li><a href="/article/1553.htm" title="[Maven学习笔记十]Maven Profile与资源文件过滤器" target="_blank">[Maven学习笔记十]Maven Profile与资源文件过滤器</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/maven/1.htm">maven</a> <div>什么是Maven Profile Maven Profile的含义是针对编译打包环境和编译打包目的配置定制，可以在不同的环境上选择相应的配置，例如DB信息，可以根据是为开发环境编译打包，还是为生产环境编译打包，动态的选择正确的DB配置信息 Profile的激活机制 1.Profile可以手工激活，比如在Intellij Idea的Maven Project视图中可以选择一个P</div> </li> <li><a href="/article/1680.htm" title="【Hive八】Hive用户自定义生成表函数(UDTF)" target="_blank">【Hive八】Hive用户自定义生成表函数(UDTF)</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/hive/1.htm">hive</a> <div>1. 什么是UDTF UDTF，是User Defined Table-Generating Functions，一眼看上去，貌似是用户自定义生成表函数，这个生成表不应该理解为生成了一个HQL Table，貌似更应该理解为生成了类似关系表的二维行数据集 2. 如何实现UDTF 继承org.apache.hadoop.hive.ql.udf.generic</div> </li> <li><a href="/article/1807.htm" title="tfs restful api 加auth 2.0认计" target="_blank">tfs restful api 加auth 2.0认计</a> <span class="text-muted">ronin47</span> <div>　　目前思考如何给tfs的ngx-tfs api增加安全性。有如下两点：　　一是基于客户端的ip设置。这个比较容易实现。　　二是基于OAuth2.0认证，这个需要lua，实现起来相对于一来说，有些难度。　　现在重点介绍第二种方法实现思路。　　前言：我们使用Nginx的Lua中间件建立了OAuth2认证和授权层。如果你也有此打算，阅读下面的文档，实现自动化并获得收益。SeatGe</div> </li> <li><a href="/article/1934.htm" title="jdk环境变量配置" target="_blank">jdk环境变量配置</a> <span class="text-muted">byalias</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/jdk/1.htm">jdk</a> <div>进行java开发，首先要安装jdk，安装了jdk后还要进行环境变量配置： 1、下载jdk（http://java.sun.com/javase/downloads/index.jsp），我下载的版本是：jdk-7u79-windows-x64.exe 2、安装jdk-7u79-windows-x64.exe 3、配置环境变量：右击"计算机"-->&quo</div> </li> <li><a href="/article/2061.htm" title="《代码大全》表驱动法-Table Driven Approach-2" target="_blank">《代码大全》表驱动法-Table Driven Approach-2</a> <span class="text-muted">bylijinnan</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>package com.ljn.base; import java.io.BufferedReader; import java.io.FileInputStream; import java.io.InputStreamReader; import java.util.ArrayList; import java.util.Collections; import java.uti</div> </li> <li><a href="/article/2188.htm" title="SQL 数值四舍五入小数点后保留2位" target="_blank">SQL 数值四舍五入小数点后保留2位</a> <span class="text-muted">chicony</span> <a class="tag" taget="_blank" href="/search/%E5%9B%9B%E8%88%8D%E4%BA%94%E5%85%A5/1.htm">四舍五入</a> <div> 1.round() 函数是四舍五入用，第一个参数是我们要被操作的数据，第二个参数是设置我们四舍五入之后小数点后显示几位。 2.numeric 函数的2个参数，第一个表示数据长度，第二个参数表示小数点后位数。例如：　　select cast(round(12.5,2) as numeric(5,2)) </div> </li> <li><a href="/article/2315.htm" title="c++运算符重载" target="_blank">c++运算符重载</a> <span class="text-muted">CrazyMizzz</span> <a class="tag" taget="_blank" href="/search/C%2B%2B/1.htm">C++</a> <div>一、加+，减-，乘*，除/ 的运算符重载 Rational operator*(const Rational &x) const{ return Rational(x.a * this->a); } 在这里只写乘法的，加减除的写法类似二、<<输出,>>输入的运算符重载 &nb</div> </li> <li><a href="/article/2442.htm" title="hive DDL语法汇总" target="_blank">hive DDL语法汇总</a> <span class="text-muted">daizj</span> <a class="tag" taget="_blank" href="/search/hive/1.htm">hive</a><a class="tag" taget="_blank" href="/search/%E4%BF%AE%E6%94%B9%E5%88%97/1.htm">修改列</a><a class="tag" taget="_blank" href="/search/DDL/1.htm">DDL</a><a class="tag" taget="_blank" href="/search/%E4%BF%AE%E6%94%B9%E8%A1%A8/1.htm">修改表</a> <div>hive DDL语法汇总１、对表重命名 hive> ALTER TABLE table_name RENAME TO new_table_name; 2、修改表备注 hive> ALTER TABLE table_name SET TBLPROPERTIES ('comment' = new_comm</div> </li> <li><a href="/article/2569.htm" title="jbox使用说明" target="_blank">jbox使用说明</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a> <div>参考网址：http://www.kudystudio.com/jbox/jbox-demo.html jBox v2.3 beta [ 点击下载] 技术交流QQGroup：172543951 100521167 [2011-11-11] jBox v2.3 正式版 - [调整&修复] IE6下有iframe或页面有active、applet控件</div> </li> <li><a href="/article/2696.htm" title="UISegmentedControl 开发笔记" target="_blank">UISegmentedControl 开发笔记</a> <span class="text-muted">dcj3sjt126com</span> <div> // typedef NS_ENUM(NSInteger, UISegmentedControlStyle) { // UISegmentedControlStylePlain, // large plain &</div> </li> <li><a href="/article/2823.htm" title="Slick生成表映射文件" target="_blank">Slick生成表映射文件</a> <span class="text-muted">ekian</span> <a class="tag" taget="_blank" href="/search/scala/1.htm">scala</a> <div>Scala添加SLICK进行数据库操作，需在sbt文件上添加slick-codegen包 "com.typesafe.slick" %% "slick-codegen" % slickVersion 因为我是连接SQL Server数据库，还需添加slick-extensions，jtds包 "com.typesa</div> </li> <li><a href="/article/2950.htm" title="ES-TEST" target="_blank">ES-TEST</a> <span class="text-muted">gengzg</span> <a class="tag" taget="_blank" href="/search/test/1.htm">test</a> <div>package com.MarkNum; import java.io.IOException; import java.util.Date; import java.util.HashMap; import java.util.Map; import javax.servlet.ServletException; import javax.servlet.annotation</div> </li> <li><a href="/article/3077.htm" title="为何外键不再推荐使用" target="_blank">为何外键不再推荐使用</a> <span class="text-muted">hugh.wang</span> <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/DB/1.htm">DB</a> <div>表的关联，是一种逻辑关系，并不需要进行物理上的“硬关联”，而且你所期望的关联，其实只是其数据上存在一定的联系而已，而这种联系实际上是在设计之初就定义好的固有逻辑。在业务代码中实现的时候，只要按照设计之初的这种固有关联逻辑来处理数据即可，并不需要在数据库层面进行“硬关联”，因为在数据库层面通过使用外键的方式进行“硬关联”，会带来很多额外的资源消耗来进行一致性和完整性校验，即使很多时候我们并不</div> </li> <li><a href="/article/3204.htm" title="领域驱动设计" target="_blank">领域驱动设计</a> <span class="text-muted">julyflame</span> <a class="tag" taget="_blank" href="/search/VO/1.htm">VO</a><a class="tag" taget="_blank" href="/search/DAO/1.htm">DAO</a><a class="tag" taget="_blank" href="/search/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">设计模式</a><a class="tag" taget="_blank" href="/search/DTO/1.htm">DTO</a><a class="tag" taget="_blank" href="/search/po/1.htm">po</a> <div>概念： VO（View Object）：视图对象，用于展示层，它的作用是把某个指定页面（或组件）的所有数据封装起来。 DTO（Data Transfer Object）：数据传输对象，这个概念来源于J2EE的设计模式，原来的目的是为了EJB的分布式应用提供粗粒度的数据实体，以减少分布式调用的次数，从而提高分布式调用的性能和降低网络负载，但在这里，我泛指用于展示层与服务层之间的数据传输对</div> </li> <li><a href="/article/3331.htm" title="单例设计模式" target="_blank">单例设计模式</a> <span class="text-muted">hm4123660</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/Singleton/1.htm">Singleton</a><a class="tag" taget="_blank" href="/search/%E5%8D%95%E4%BE%8B%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">单例设计模式</a><a class="tag" taget="_blank" href="/search/%E6%87%92%E6%B1%89%E5%BC%8F/1.htm">懒汉式</a><a class="tag" taget="_blank" href="/search/%E9%A5%BF%E6%B1%89%E5%BC%8F/1.htm">饿汉式</a> <div> 单例模式是一种常用的软件设计模式。在它的核心结构中只包含一个被称为单例类的特殊类。通过单例模式可以保证系统中一个类只有一个实例而且该实例易于外界访问，从而方便对实例个数的控制并节约系统源。如果希望在系统中某个类的对象只能存在一个，单例模式是最好的解决方案。 &nb</div> </li> <li><a href="/article/3458.htm" title="logback" target="_blank">logback</a> <span class="text-muted">zhb8015</span> <a class="tag" taget="_blank" href="/search/log/1.htm">log</a><a class="tag" taget="_blank" href="/search/logback/1.htm">logback</a> <div>一、logback的介绍 Logback是由log4j创始人设计的又一个开源日志组件。logback当前分成三个模块：logback-core,logback- classic和logback-access。logback-core是其它两个模块的基础模块。logback-classic是log4j的一个改良版本。此外logback-class</div> </li> <li><a href="/article/3585.htm" title="整合Kafka到Spark Streaming——代码示例和挑战" target="_blank">整合Kafka到Spark Streaming——代码示例和挑战</a> <span class="text-muted">Stark_Summer</span> <a class="tag" taget="_blank" href="/search/spark/1.htm">spark</a><a class="tag" taget="_blank" href="/search/storm/1.htm">storm</a><a class="tag" taget="_blank" href="/search/zookeeper/1.htm">zookeeper</a><a class="tag" taget="_blank" href="/search/PARALLELISM/1.htm">PARALLELISM</a><a class="tag" taget="_blank" href="/search/processing/1.htm">processing</a> <div>作者Michael G. Noll是瑞士的一位工程师和研究员，效力于Verisign，是Verisign实验室的大规模数据分析基础设施（基础Hadoop）的技术主管。本文，Michael详细的演示了如何将Kafka整合到Spark Streaming中。期间， Michael还提到了将Kafka整合到 Spark Streaming中的一些现状，非常值得阅读，虽然有一些信息在Spark 1.2版</div> </li> <li><a href="/article/3712.htm" title="spring-master-slave-commondao" target="_blank">spring-master-slave-commondao</a> <span class="text-muted">王新春</span> <a class="tag" taget="_blank" href="/search/DAO/1.htm">DAO</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/dataSource/1.htm">dataSource</a><a class="tag" taget="_blank" href="/search/slave/1.htm">slave</a><a class="tag" taget="_blank" href="/search/master/1.htm">master</a> <div>互联网的web项目，都有个特点：请求的并发量高，其中请求最耗时的db操作，又是系统优化的重中之重。为此，往往搭建 db的一主多从库的数据库架构。作为web的DAO层，要保证针对主库进行写操作，对多个从库进行读操作。当然在一些请求中，为了避免主从复制的延迟导致的数据不一致性，部分的读操作也要到主库上。（这种需求一般通过业务垂直分开，比如下单业务的代码所部署的机器，读去应该也要从主库读取数</div> </li> </ul> </div> </div> </div> <div> <div class="container"> <div class="indexes"> <strong>按字母分类：</strong> <a href="/tags/A/1.htm" target="_blank">A</a><a href="/tags/B/1.htm" target="_blank">B</a><a href="/tags/C/1.htm" target="_blank">C</a><a href="/tags/D/1.htm" target="_blank">D</a><a href="/tags/E/1.htm" target="_blank">E</a><a href="/tags/F/1.htm" target="_blank">F</a><a href="/tags/G/1.htm" target="_blank">G</a><a href="/tags/H/1.htm" target="_blank">H</a><a href="/tags/I/1.htm" target="_blank">I</a><a href="/tags/J/1.htm" target="_blank">J</a><a href="/tags/K/1.htm" target="_blank">K</a><a href="/tags/L/1.htm" target="_blank">L</a><a href="/tags/M/1.htm" target="_blank">M</a><a href="/tags/N/1.htm" target="_blank">N</a><a href="/tags/O/1.htm" target="_blank">O</a><a href="/tags/P/1.htm" target="_blank">P</a><a href="/tags/Q/1.htm" target="_blank">Q</a><a href="/tags/R/1.htm" target="_blank">R</a><a href="/tags/S/1.htm" target="_blank">S</a><a href="/tags/T/1.htm" target="_blank">T</a><a href="/tags/U/1.htm" target="_blank">U</a><a href="/tags/V/1.htm" target="_blank">V</a><a href="/tags/W/1.htm" target="_blank">W</a><a href="/tags/X/1.htm" target="_blank">X</a><a href="/tags/Y/1.htm" target="_blank">Y</a><a href="/tags/Z/1.htm" target="_blank">Z</a><a href="/tags/0/1.htm" target="_blank">其他</a> </div> </div> </div> <footer id="footer" class="mb30 mt30"> <div class="container"> <div class="footBglm"> <a target="_blank" href="/">首页</a> - <a target="_blank" href="/custom/about.htm">关于我们</a> - <a target="_blank" href="/search/Java/1.htm">站内搜索</a> - <a target="_blank" href="/sitemap.txt">Sitemap</a> - <a target="_blank" href="/custom/delete.htm">侵权投诉</a> </div> <div class="copyright">版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved.  </div> </div> </footer>  <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shCore.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shLegacy.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shAutoloader.js"></script> <link type="text/css" rel="stylesheet" href="/static/syntaxhighlighter/styles/shCoreDefault.css"/> <script type="text/javascript" src="/static/syntaxhighlighter/src/my_start_1.js"></script> </body> </html>