记录工作学习路上的点点滴滴
1、鼠标移到表格行上变色
<script src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#tbHandle tr").mouseover(function(){ $(this).find("td").addClass("mouse_color"); }); $("#tbHandle tr").mouseout(function(){ $(this).find("td").removeClass("mouse_color"); }); }); </script>
.mouse_color{background:#ebebeb;}
2、点击目录滑动式地展开/收缩子目录
<script src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#menu").click(function(){ $("#sub").slideToggle("slow"); }); });
3、购物数量加减运算
<script src="jquery-1.11.3.min.js"></script> <script> $(document).ready(function(){ $(".btnAdd").click(function(){ var n = $(".inputNum").val(); var num = parseInt(n) + 1; if(num > 0){ $(".inputNum").val(num); } }); $(".btnSub").click(function(){ var n = $(".inputNum").val(); var num = parseInt(n) - 1; if(num > 0){ $(".inputNum").val(num); } }); }); </script>
4、根据单选项选中的值来判断显示隐藏内容
<script src="jquery-1.11.3.min.js"></script> <script> $(document).ready(function(){ $(".fp").change(function(){ var value = $("input[name='fapiao']:checked").val(); if(value == "yes"){ $(".fapiao").show(); }else{ $(".fapiao").hide(); } }); }); </script>
5、多行文本框字数统计限制
<li class="right" id="wordCount"> <textarea></textarea> <div class="numText">还可以输入 <span class="word">250</span> 字</div> </li>
<script src="jquery-1.11.3.min.js"></script> <script> $(function(){ //先选出 textarea 和 统计字数 dom 节点 var wordCount = $("#wordCount"), textArea = wordCount.find("textarea"), word = wordCount.find(".word"); //调用 statInputNum(textArea,word); }); /* * 剩余字数统计 * 注意 最大字数只需要在放数字的节点哪里直接写好即可 如:<var class="word">200</var> */ function statInputNum(textArea,numItem) { var max = numItem.text(), curLength; textArea[0].setAttribute("maxlength", max); curLength = textArea.val().length; numItem.text(max - curLength); textArea.on('input propertychange', function () { numItem.text(max - $(this).val().length); }); } </script>
6、获取短信验证码程序
<script src="jquery-1.11.3.min.js"></script> <script> $(document).ready(function(){ $(".btnCode").click(function(){ $(this).html("重新获取(60S)"); }); }); var InterValObj; //timer变量,控制时间 var count = 60; //间隔函数,1秒执行 var curCount;//当前剩余秒数 function sendMessage() { curCount = count; //设置button效果,开始计时 $("#btnSendCode").attr("disabled", "true"); $("#btnSendCode").val("请在 " + curCount + " 秒内输入验证码"); InterValObj = window.setInterval(SetRemainTime, 1000); //启动计时器,1秒执行一次 //向后台发送处理数据 $.ajax({ type: "POST", //用POST方式传输 dataType: "text", //数据格式:JSON url: 'Login.ashx', //目标地址 data: "dealType=" + dealType +"&uid=" + uid + "&code=" + code, error: function (XMLHttpRequest, textStatus, errorThrown) { }, success: function (msg){ } }); } //timer处理函数 function SetRemainTime() { if (curCount == 0) { window.clearInterval(InterValObj);//停止计时器 $("#btnSendCode").removeAttr("disabled");//启用按钮 $("#btnSendCode").val("重新发送验证码"); } else { curCount--; $("#btnSendCode").val("请在" + curCount + "秒内输入验证码"); } } </script>