• 工作中的js总结


    1、点击li下面匹配的内容块跟着一起改变

    1 $(".dis-list li").bind("hover click", function () {
    2 $this = $(this);
    3 $this.addClass("active").siblings().removeClass("active");
    4 $(".list-content li.item").eq($this.index()).addClass("on").siblings().removeClass("on");
    5 });

    2、升序降序

     1 (function ($) {
     2 
     3 $(document).ready(function () {
     4 
     5 //调序
     6 $("a[id^='ascent-']").first().hide();
     7 $("a[id^='decline-']").last().hide();
     8 
     9 //上升
    10 $("a[id^='ascent-']").click(function (e) {
    11 e.preventDefault();
    12 var tr = $(this).parents("tr:first");
    13 var id = tr.data("id");
    14 var referenceId = tr.prev().data("id");
    15 
    16 $.post($(this).attr("href"), { id: id, referenceId: referenceId }, function (data) {
    17 var trBefore = tr.prev();
    18 tr.insertBefore(trBefore);
    19 $("a[id^='ascent-'],a[id^='decline-']").show();
    20 $("a[id^='ascent-']").first().hide();
    21 $("a[id^='decline-']").last().hide();
    22 });
    23 });
    24 
    25 //下降
    26 $("a[id^='decline-']").click(function (e) {
    27 e.preventDefault();
    28 var tr = $(this).parents("tr:first");
    29 var id = tr.data("id");
    30 var referenceId = tr.next().data("id");
    31 
    32 $.post($(this).attr("href"), { id: id, referenceId: referenceId }, function (data) {
    33 var trAfter = tr.next();
    34 tr.insertAfter(trAfter);
    35 $("a[id^='ascent-'],a[id^='decline-']").show();
    36 $("a[id^='ascent-']").first().hide();
    37 $("a[id^='decline-']").last().hide();
    38 });
    39 });
    40 
    41 });
    42 
    43 })(jQuery);
    44 
    45  

    3、鼠标进入和离开的事件

    1 $(".reminder-dropdown").mouseenter(function () {
    2      $(this).addClass("show-select");})
    3         .mouseleave(function () {
    4     $(this).removeClass("show-select");
    5 });

    4、高效利用JQuery

    http://www.w3cfuns.com/article-1302-1.html

    5、当滚动条滚动到一定的程度时,缩小导航高度,当返回的时候,还原导航高度

    1 .nav-fixed { width: 100%; height: 120px; position: fixed; left: 0; top: 0; z-index: 999; background: #dadada; }
     1 <script type="text/javascript">
     2  $(document).ready(function(e) {
     3     $(document).on("scroll",function(){
     4     if($(document).scrollTop()>200){ 
     5         $(".nav").stop().animate({
     6             height:'50px'
     7         });
     8     }else{
     9         $(".nav").stop().animate({
    10             height:'100px'
    11         });  
    12     }        
    13    }); 
    14 });
    15 </script>
  • 相关阅读:
    You are not late! You are not early!
    在同一个服务器(同一个IP)为不同域名绑定的免费SSL证书
    Vue.js Is Good, but Is It Better Than Angular or React?
    It was not possible to find any compatible framework version
    VS增加插件 Supercharger破解教程
    Git使用ssh key
    Disconnected: No supported authentication methods available (server sent: publickey)
    VS 2013打开.edmx文件时报类型转换异常
    asp.net MVC4 框架揭秘 读书笔记系列3
    asp.net MVC4 框架揭秘 读书笔记系列2
  • 原文地址:https://www.cnblogs.com/fangdx/p/3974710.html
Copyright © 2020-2023  润新知