1.判断屏幕高度

$(document).ready(function() {
    $("#left").height($(window).height());
    $("#main").height($(window).height() - 80);
    //t = (screen.height - 30)  
});

2.下拉框选中内容替换原有文字(类似城市切换)

$(".display ul li").click(function() {
            $(".display").hide();
            $(".xzsj span").empty().prepend($(this).text());
});

3.简单开关按钮

<p class="sexp" style="width: 150px">
            <span class="sex boy activesex">男</span>
            <span class="sex">女</span>
        </p>

$('.sex').click(function(){
                    $(this).removeClass('activesex');
                    $(this).addClass('activesex').siblings('span').removeClass('activesex');
                })
  3.增加id

$(".tab ul li").click(function(){
         $(".tab ul li").eq($(this).index()).attr('id',"active_tab").siblings().removeAttr('id','active_tab');
       //另一种方法: $("div").eq($(".tab li").index(this)).addClass("on").siblings().removeClass('on');

});

4.children parent用处多多

$('.boxlist1').mouseover(function(){
   $(this).children('.listdetail').children('.rightbj').css('display','block');
});
$('.boxlist1').mouseout(function(){
     $(".rightbj").hide();
});

$('.hover_bj').mouseover(function(){
                    $(this).children('.xiugai').css('display','block');
                });
                $('.hover_bj').mouseout(function(){
                    $(this).children('.xiugai').css('display','none');
                    
                })

5.判断

if ($(this).text()=="月报") {
      $(".selectzcfz").show();
         
     } else{
          $(".selectzcfz2").show();
          $(".selectzcfz").hide();
     }
6.   判断当前样式如果是a,则b隐藏,如果是b,则a隐藏

<script>
                $(function(){
                    $('a').click(function(){
                        if($(this).hasClass('close')){
                            $(this).css('display','none');
                            $(this).siblings('a').css('display','inline');
                            
                        }else if($(this).hasClass('open')){
                            $(this).css('display','none');
                            $(this).siblings('a').css('display','inline');
                        }
                    })
                })
            </script>

7.切换按钮

$('.yiqiyong').click(function() {
    $(this).toggleClass('yiqiyong');
    $(this).toggleClass('yijinyong');
});

idong常用js总结的更多相关文章

  1. 常用js方法

    function dateGetter(name, size, offset, trim) { offset = offset || 0; return function (date) { var v ...

  2. 常用JS正则表达式

    常用JS正则表达式 收集一些常用的JavaScript正则表达式匹配规则,比如匹配电话号码.Email.中文字符.身份证号.邮编.QQ号.过滤空白行.匹配特定数字等.觉得这玩意是很有用的,只不过自己水 ...

  3. 常用js方法整理common.js

    项目中常用js方法整理成了common.js var h = {}; h.get = function (url, data, ok, error) { $.ajax({ url: url, data ...

  4. 原生JS研究:学习jquery源码,收集整理常用JS函数

    原生JS研究:学习jquery源码,收集整理常用JS函数: 1. JS获取原生class(getElementsByClass) 转自:http://blog.csdn.net/kongjiea/ar ...

  5. 项目中常用js方法整理common.js

    抽空把项目中常用js方法整理成了common.js,都是网上搜集而来的,大家一起分享吧. var h = {}; h.get = function (url, data, ok, error) { $ ...

  6. 常用js正则表达式大全

    常用js正则表达式大全.一.校验数字的js正则表达式 1 数字:^[0-9]*$ 2 n位的数字:^\d{n}$ 3 至少n位的数字:^\d{n,}$ 4 m-n位的数字:^\d{m,n}$ 5 零和 ...

  7. api日常总结:前端常用js函数和CSS常用技巧

    我的移动端media html{font-size:10px} @media screen and (min-width:321px) and (max-width:375px){html{font- ...

  8. web前端关于html转义符的常用js函数

    web前端关于html转义符的常用js函数 //去掉html标签 function removeHtmlTab(tab) { return tab.replace(/<[^<>]+? ...

  9. 基础常用JS函数和语法

    100多个基础常用JS函数和语法集合大全  来源:http://www.cnblogs.com/hnyei/p/4605103.html 网站特效离不开脚本,javascript是最常用的脚本语言,我 ...

随机推荐

  1. vc2015编译paho.mqtt.c-1.1.0

    vc2015打开“\paho.mqtt.c-1.1.0\Windows Build\Paho C MQTT APIs.sln” 将文件“\paho.mqtt.c-1.1.0\src\VersionIn ...

  2. linux文件和目錄管理的基本命令命令

    ls命令 作用:顯示目標列表或目錄的內容 語法:ls[選項][目錄或文件] -a:顯示指定目錄下所有子目錄與文件,包括隱藏文件 -l:顯示文件的詳細信息 -d: 顯示目錄 例:ls -dl cd命令 ...

  3. 目前学习.net时间让我摸不着头脑的事情

    呜呜,不太喜欢做笔记,只喜欢把自己不懂的和预习时间有麻烦的简单记下,所以这里也是能可以让我写下我们的学习点滴··· 今天学习了<1>.变量的作用域,在想是不是之前听过的局部变量和全局变量? ...

  4. 深入理解Auto Layout 第一弹

    本文转载至 http://zhangbuhuai.com/2015/07/16/beginning-auto-layout-part-1/ By 张不坏 2015-07-16 更新日期:2015-07 ...

  5. 《C++ Primer Plus》16.2 智能指针模板类

    智能指针是行为类似于指针的类对象,单这种对象还有其他功能.本节介绍三个可帮助管理动态内存分配的智能指针类.先来看看需要哪些功能以及这些功能是如何实现的.请看下面的函数:void remodel(std ...

  6. 【PHP】 php 解析 base64图片上传

    base64 图片编码格式: 类似如下 data:image/JPG;base64,/9j/4S/+RXhpZgAATU0AKgAAAAgACwEPAAIAAAAG php 解析代码如下:  基于tp ...

  7. 【大数据系列】win10不借助Cygwin安装hadoop2.8

    一.下载安装包 解压安装包并创建data,name,tmp文件夹 二.修改配置文件 1.core-site.xml <?xml version="1.0" encoding= ...

  8. CSS3 -- 动画库

    http://www.jq22.com/yanshi819 文件结构: html <!DOCTYPE html> <html lang="zh-CN"> & ...

  9. Apache服务器SSL双向认证配置

    以Win32版Apache与OpenSSL为例,介绍从创建数字证书到Apache配置的整个过程,希望对读者有所帮助. Apache是目前最流行的WEB服务器之一,借助OpenSSL库,我们可以在Apa ...

  10. Sencha Touch 扩展集合

    https://market.sencha.com/extensions http://try.sencha.com/touch/2.1.0/ http://www.mitchellsimoens.c ...