记录工作学习路上的点点滴滴

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>

 

转载于:https://www.cnblogs.com/-lijun/p/4455938.html