随笔分类 -  jquery

前端开发技术jquery
checkbox全选-取消-再全选没有显示问题
摘要:源码: <input type="checkbox" id="cleckAll" />全选 <div class="list"> <input type="checkbox" />复选一 <input type="checkbox" />复选二 <input type="checkbox" />复选 阅读全文
posted @ 2016-07-10 11:08 小老虎网络 阅读(444) 评论(0) 推荐(0) 编辑
textarea格式显示问题
摘要:在 textarea 表单标签中,当保存有换行的样式时,一般的方法有: 注:这里的info 为要显示的内容;一、保存后在textarea 表单标签中显示时: info.replace(/\n/g, '\\n'); 大概效果如:(这个框框为textarea 表单标签);二、在页面中显示时: 方... 阅读全文
posted @ 2015-12-01 17:59 小老虎网络 阅读(3611) 评论(0) 推荐(0) 编辑
表单输入实时检测
摘要:$('input').on('input propertychange', function() { console.log('打印'); });延伸知识:1、回车提交绑定:标签上添加:onfocus="document.onkeydown = ifFocus" onblur="documen... 阅读全文
posted @ 2015-09-30 17:54 小老虎网络 阅读(439) 评论(0) 推荐(0) 编辑
HTML5实现摇一摇
摘要:一、原理:利用devicemotion获取移动速度,得到device移动时相对之前某个时间的差值比二、效果图:三、源码://先判断设备是否支持HTML5摇一摇功能if (window.DeviceMotionEvent) { //获取移动速度,得到device移动时相对之前某个时间的差值比 wind... 阅读全文
posted @ 2015-07-28 11:06 小老虎网络 阅读(10547) 评论(7) 推荐(2) 编辑
jquery实现标签上移、下移、置顶
摘要:eg:如在后台的标签列表中,实现上移、下移、置顶功能思路:1、先用到的克隆方法.clone(true): 即把当前要移动的项先保存好,备于后用。2、找到当前标签所对应的相关元素及其相关方法: 如:.prev()当前元素上面的标签 .next()当前元素下面的标签 .after()xxx之后添加方法 ... 阅读全文
posted @ 2015-04-24 14:22 小老虎网络 阅读(10492) 评论(2) 推荐(0) 编辑
each处理json数据
摘要:eg:给传进来的ID中当其对应的值为true时,即给对应的ID标签添加一个class 名为 focus,如:var obj = { id01:'true', id02:'flase', id03:'true'};$.each(obj,function(key,val){ if(val == 'tr... 阅读全文
posted @ 2015-04-22 15:56 小老虎网络 阅读(542) 评论(0) 推荐(0) 编辑
jquery中prop()与attr()方法的区别
摘要:一、prop() 简单来说是当需要判断真假时使用,如复选框时: if( $(this).prop('checked')){ //当返回true时在这里调用 }else{ //当返回false时在这里调用 } TIPS:相关判断$(this).is(':checked')--这个用得酷点 二、attr 阅读全文
posted @ 2015-04-14 17:09 小老虎网络 阅读(158) 评论(0) 推荐(0) 编辑
实现表单的输入框当光标为当前时,去掉默认值
摘要:作用:实现表单的输入框当光标为当前时,去掉默认值,当光标离开原默认值没有发生改变时,再次显示默认值,按钮除外; 实现代码如下(jquery版): $(":input").not(":input[type=submit],:input[type=button]").focus(function(){ 阅读全文
posted @ 2013-06-26 16:02 小老虎网络 阅读(2510) 评论(0) 推荐(0) 编辑
引用类型--Array进行数值对比(应用jquery版)
摘要:两个或多个“对象”进行比较时... 阅读全文
posted @ 2013-01-24 16:21 小老虎网络 阅读(2230) 评论(0) 推荐(0) 编辑
表单SELECT相关操作
摘要:1. var checkText=$("#select_id").find("option:selected").text(); //获取Select选择的Text2. var checkValue=$("#select_id").val(); //获取Select选择的Value 阅读全文
posted @ 2012-04-09 17:52 小老虎网络 阅读(449) 评论(0) 推荐(1) 编辑
js实现锚点
摘要:1、代码:$("body,html").animate({scrollTop:$("xxx").offset().top});2、解释:(1)、兼容性能:$("body,html")中的“body”支持safari浏览器,”html”支持FF、IE、OPERA…;(2)、$("xxx").offset().top 为获得要锚点处在当前视口的高度相对偏移 ; 阅读全文
posted @ 2012-02-12 14:13 小老虎网络 阅读(8013) 评论(0) 推荐(0) 编辑
弹窗插件
摘要:一、效果图:(1、只是单纯的信息提示)(2、判断操作正解时返回的信息提示)(3、判断操作失误时返回的信息提示)tips:1、简单易用,只需调用相应的函数即可 2、源文件下载:http://files.cnblogs.com/waitingbar/maskinfo%E5%BC%B9%E7%AA%97.rar二、HTML:<link rel="stylesheet" type="text/css" href="css/maskinfo.css" /> <script type="text/javascript& 阅读全文
posted @ 2011-12-05 16:43 小老虎网络 阅读(774) 评论(0) 推荐(0) 编辑
jquery chrome下得到图片的宽度
摘要:$(window).load(function(){ // 将你希望在页面完全就绪之后运行的代码放在这里 });参考原文:http://blog.xmnn.cn/?uid-525196-action-viewspace-itemid-1183190 或 http://archive.cnblogs.com/a/1937482/ 阅读全文
posted @ 2011-08-03 17:36 小老虎网络 阅读(456) 评论(0) 推荐(0) 编辑
动感图文轮显
摘要:一、效果图: tips:源码下载地址:http://files.cnblogs.com/waitingbar/sliderImgTxt.rar二、源码show:<script language="javascript" src="js/jquery1.4.js"></script> <script language="javascript" src="js/sliderImgTxt.js"></script> <script language="jav 阅读全文
posted @ 2011-06-03 10:52 小老虎网络 阅读(404) 评论(0) 推荐(0) 编辑
实现一个时钟展示(jq插件)
摘要:一、效果图: tips:1、简单易用,只需指定显示的区域即可 如:$("#txt").timeShow()中的id txt 即为显示区; 2、源文件下载:http://files.cnblogs.com/waitingbar/timeshow(2011.05.17).rar 二、HTML: <script type="text/javascript" src="js/jquery1.4.js"... 阅读全文
posted @ 2011-05-03 15:40 小老虎网络 阅读(1869) 评论(0) 推荐(2) 编辑
实用图片轮显(一)
摘要:一、效果图: TIPS:下载地址:http://files.cnblogs.com/waitingbar/slideImgNum.rar 二、HTML代码: <script language="javascript" type="text/javascript" > $(document).ready(function(){ $("#slideImgNum").slideImgNum(); ... 阅读全文
posted @ 2011-04-28 12:03 小老虎网络 阅读(487) 评论(0) 推荐(0) 编辑
jquery插件之无缝循环新闻列表
摘要:一、效果图: tips源码下载:http://files.cnblogs.com/waitingbar/newslist.rar二、jquery源码: (function($){ $.fn.extend({ newsList:function(options){ var defaults ={ actName:'li', //显示条数名; maxShowNum:'6', //最多的显示条数; actNameH:'28', //一次移动的距离; ulClass:'.ul_news_list', //被复制层的class copyUl 阅读全文
posted @ 2011-03-04 15:29 小老虎网络 阅读(1418) 评论(0) 推荐(0) 编辑
jquery插件之图片轮显(一)----整理2011.02.24
摘要:一、心得: 从今年第一天上班开始,一直在学习jquery插件方面的知识,到现在也快有两个星期了,感觉学好这插件不难。因为想学好它,所以一直都很努力! 总结jquery插件书写格式为(如有错误,欢迎指正!): (function($){ //扩展这个方法到jquery; $.fn.extend({ //将可选择的变量传递给方法如:slideimg slideimg: function(option... 阅读全文
posted @ 2011-02-24 10:28 小老虎网络 阅读(1364) 评论(13) 推荐(0) 编辑
jquery插件之图片轮显(一)
摘要:一、效果图: tips:源码下载:http://files.cnblogs.com/waitingbar/text.rar二、jquery源码:三、HTML:<div id="slideimgbar"> <div class="slidetolrbar4"> <div class="slide_tolr"> <dl class="dl_line1l_3"> <dd class="imgborder img96_67"><img src="../images/demoimg/1.jpg" /></dd> < 阅读全文
posted @ 2011-02-21 17:37 小老虎网络 阅读(2255) 评论(0) 推荐(0) 编辑
jquery插件之图片show and hide(一)
摘要:一、效果图: tips:源码下载:http://files.cnblogs.com/waitingbar/orderlist.rar二、jquery源码:三、HTML:<script language="javascript"> /* *说明: *big_id_order_bar:为最外层id; *over_order_class 参数为:经过某最外层的class,带'.'传进来; *show_order_class:作用层所在的class名 */ $(document).ready(function() { $("#testxxx_bar").slide_show_hide(); 阅读全文
posted @ 2011-02-16 16:54 小老虎网络 阅读(2472) 评论(0) 推荐(1) 编辑