js日常笔记

写在前面：

　　在工作中，有时候会遇到一些零零碎碎的小知识点，虽然这些网上都可以查询到，但还是想把一些自己不是很熟悉的当做笔记记录下来，方便以后查询。

1.按钮隐藏/显示/可用/不可用

 $("#nextBtn").css("display","inline");//按钮显示

 $("#nextBtn").css("display","none");//按钮隐藏

 $("#nextBtn").attr("disabled",false);//按钮可用

 $("#nextBtn").attr("disabled",true);//按钮不可用

var btnCss = $("#nextBtn").attr("disabled");//获取按钮某个属性值

　　弹出确认框，点击确定，执行logout,取消则不执行

<a href="logout" onclick="return confirm('确定要退出登录吗？');">

    退出

</a>

　　js中获取java变量值

<script type="text/javascript">

        var errorMsg = '<%=request.getParameter("errorMsg")%>';

        if(errorMsg == "null"){

            //当没有传递erroeMsg时执行

              ...

        }else{

             ...

        }

    </script>

对于为什么要用=="null",来判断errorMsg不存在，因为是加了'<%=request.getParameter("errorMsg")%>'，单引号，才可以使用，如果不加，则报错。故这里为null用字符串的形式来判断。

　　下拉框select某一选项设置为不可选:

方法1：

<select>

        <option value="1" >1</option>

        <optgroup label="不可选" style=""></optgroup>

        <option value="2">2</option>

        <option value="3">3</option>

    </select>

方法2：

var selectedTo = document.getElementById("dDateTo");

var ops = selectedFrom.options;

//将索引为1的选项禁用掉，option变为不可选

ops[1].disabled = "false";

　　window.opener.location.href="/dailyreport/dailyRecordMaintain.jsp?time="+new Date().getTime()+"&oldDate="+pickedDate;

　　父窗口带参数刷新

　　遍历select下拉框，进行选项默认选中

var selectedFrom = document.getElementById("dDateFrom");

var ops1 = selectedFrom.options;

for(var i=0;i<ops.length;i++){

            var temp1 = ops[i].value;

            if(WorkT == temp1){

                ops[i].selected = "selected";

                   break;

            }

    }

7.调用js函数带参数传递，一定要注意如果传递的参数是非数字的，即是字符串的，一定要加上引号再传递，此种在拼接组件的时候要注意下

'<button id="start" onclick="startClick(\''+row.projWorkItemAssId+'\','+row.projId+','+row.workItemId+')" value="start">Start</button>',

　　黄色背景部分\'表的是一个单引号

8.下拉框默认显示提示语，且不出现在option选项中

var headOpt = "<option value='' disabled selected hidden>---选择---</option>";

$("#bUnit3").append(headOpt);

9.通过div的多个样式去查找元素

$("div[class='pull-left pagination-detail']").empty();

10.jsp页面常用获取项目路径

<%

    String scheme = request.getScheme();

    String serverName = request.getServerName();

    String contextPath = request.getContextPath();

    int port = request.getServerPort();

    //网站的访问跟路径

    String baseURL = scheme + "://" + serverName + ":" + port

            + contextPath;

    request.setAttribute("baseURL", baseURL);

%>

　　在js中使用直接使用el表达式调用${baseURL}

11.js中使用数组添加元素

var sortArr = new Array();

sortArr.push("aa");

12.table不换行设置

<table id="tableOne" class="text-nowrap">

</table>

13.input输入框变成下划线的样式

    /*輸入框變下劃線*/

        .timeInput{

            border-bottom: 1px solid #dbdbdb;

            border-top:0px;

            border-left:0px;

            border-right:0px;

            width: 10px;

        }

14.css将input输入框变成下划线

border-color: #878787;

border-style: solid;

border-top-width: 0px;

border-right-width: 0px;

border-bottom-width: 1px;

border-left-width: 0px"

15.js中将json数组字符串转为对象

var t2="[{name:'zhangsan',age:'24'},{name:'lisi',age:'30'},{name:'wangwu',age:'16'},{name:'tianqi',age:'7'}] ";

var myobj=eval(t2);

for(var i=0;i<myobj.length;i++){

   alert(myobj[i].name);

   alert(myobj[i].age);

}

16.下拉框初始化常用(两种方式都可以)

$("#sel_division").empty();

var headOpt = "<option value='-1' selected >-----------請選擇-----------</option>";

$("#sel_division").append(headOpt);

$("#sel_division").find("option:not(:first)").remove();

17.图片铺满div，并解决ie8使用cover不生效

.navbar-default{

      /*让图片铺满*/

      width: 100vw;

      height: 80px;

      background-image: url('${baseURL}/pic/header_2.png');

      background-position: center center;

      background-size: cover;

      background-repeat: no-repeat;

      /*解决ie8使用background-size:cover不生效*/

      filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=Enabled, sizingMethod=scale , src='${baseURL}/pic/header_2.png');

    }

18.常用div适应屏幕大小css设置

<!DOCTYPE html>

    html,body{

      margin:0;

      padding:0;

      width: 100%;

      height:100%;

    }

    div{

      /*让div与body高度一致*/

      width:100%;

      height:100%;

      /*border:1px solid red;*/

      overflow:hidden;

      margin:0 auto;

    }

19.

<!DOCTYPE html>

20.iframe框架中子页面获取父页面iframe的高度

　　通过方法的形式来调用，在父页面写一个方法获取高度，然后在子页面使用方法调用

　　父页面：

<div id="myDiv" class="page-content" style="">

        <iframe id="iframe_0" src="${baseURL}/Views/BasePages/engineer.jsp" width="100%" height="100%" onload="changeFrameHeight(this)" scrolling="yes" frameborder="no" border="0" marginwidth="0" marginheight="0"  allowtransparency="yes">

          <%--changeFrameHeight(this)--%>

        </iframe>

</div>

<script type="text/javascript">

    var changeFrameHeight = function (that) {

        $(that).height(document.documentElement.clientHeight - 120);

        //console.log(document.documentElement.clientHeight - 120)

    }

    //获取iframe的高度

    function getFrameHeight(){

        return (document.documentElement.clientHeight - 120);

    }

</script>

　　子页面：engineer.jsp

//获取iframe的高度

var frameH = parent.getFrameHeight();

　　父页面调用子页面的方法，在子页面写好save_btn()方法即可

 $('#projectOwnerFrame')[0].contentWindow.save_btn();

21.序列化表单

var p = serializeForm($("#header_form2")) || {};

//序列化表单

    function serializeForm(form){

        var obj = {};

        $.each(form.serializeArray(),function(index){

            if(obj[this['name']]){

                obj[this['name']] = obj[this['name']] + ','+this['value'];

            } else {

                obj[this['name']] =this['value'];

            }

        });

        return obj;

    }

js日常笔记的更多相关文章

Js日常笔记之变量删除
在Javascript是可以使用delete来手动删除变量,通过这样的方法让GC来回收内存,但在JS中并不是所有的对象都可以被删除的 JS中通过 var\function 声明因含有DontDelet ...
Js日常笔记之数组
1.Array构造函数有一个很大的问题,就是不同的参数,会导致它的行为不一致,es6好像专门为此对数组有升级因此,不建议使用new Array生成新数组,直接使用数组字面量[...]是更好的做法. ...
Js日常笔记之this
在javascript中自己创建构造函数时可以利用this来指向新创建的对象上.这样就可以避免函数中的this指向全局了,如下 var x = 2; function test(){ this.x = ...
JS面向对象笔记二
菜单导航,<JS面向对象笔记一>, 参考书籍:阮一峰之<JavaScript标准参考教程> 一.构造函数和new命令二.this关键字三.构造函数和new命令四.构造函 ...
js学习笔记：webpack基础入门（一）
之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...
Vue.js学习笔记（2）vue-router
vue中vue-router的使用:
.Net 转战 Android 4.4 日常笔记目录
.Net 转战 Android 4.4 日常笔记(1)--工具及环境搭建 .Net 转战 Android 4.4 日常笔记(2)--HelloWorld入门程序 .Net 转战 Android 4.4 ...
js读书笔记
js读书笔记基本类型的基本函数总结 1. Boolean() 数据类型转换为true的值转换为false的值 Boolean true false String 任何非空字符串 "&q ...
React.js入门笔记
# React.js入门笔记核心提示这是本人学习react.js的第一篇入门笔记,估计也会是该系列涵盖内容最多的笔记,主要内容来自英文官方文档的快速上手部分和阮一峰博客教程.当然,还有我自己尝试的 ...

随机推荐

leetcode 201. 数字范围按位与解题报告
给定范围 [m, n],其中 0 <= m <= n <= 2147483647,返回此范围内所有数字的按位与(包含 m, n 两端点). 示例 1: 输入: [5,7] 输出: 4 ...
设置EntityFramework中decimal类型数据精度问题(EF默认将只会保留到2为精度)
原文:设置EntityFramework中decimal类型数据精度 EF中默认的decimal数据精度为两位数,当我们数据库设置的精度大于2时,EF将只会保留到2为精度. e.g. .19990将会 ...
Angular & RxJS & Typescript
Angular & RxJS & Typescript https://www.wmnetwork.cc/d/?mid=75627 杭州经开区国际创博中心 https://www.w ...
第十六篇：django基础
本篇内容创建程序程序目录流程介绍 login实例一.创建程序命令行: django-admin startproject sitename. 常用命令: python manage.py r ...
【bzoj2324】[ZJOI2011]营救皮卡丘最短路-Floyd+有上下界费用流
原文地址:http://www.cnblogs.com/GXZlegend/p/6832504.html 题目描述皮卡丘被火箭队用邪恶的计谋抢走了!这三个坏家伙还给小智留下了赤果果的挑衅!为了皮卡丘 ...
不允许有匹配 "[xX][mM][lL]" 的处理指令目标。
xml文件报错: 不允许有匹配 "[xX][mM][lL]" 的处理指令目标. 指的注意的是规范的XML格式: <?xml version="1.0" ...
关于ECDSA/ECC(密钥加密传输)和ECDSA/ECDH(密钥磋商)
关于ECDSA/ECC(密钥加密传输)和ECDSA/ECDH(密钥磋商) 来源: https://blog.csdn.net/xueyepiaoling/article/details/6243337 ...
[洛谷P4889]kls与flag
题目大意:有$n$根竹竿,第$i$根竹竿在$i$位置,第$i$根竹竿高度为$h_i$,每根竹竿可以向左倒或向右倒,问有几对竹竿倒下后顶端重合. 题解:求出每根竹竿倒下后的位置,离散化,记录一下每个 ...
[poj] 2749 building roads
原题 2-SAT+二分答案! 最小的最大值,这肯定是二分答案.而我们要2-SATcheck是否在该情况下有可行解. 对于目前的答案limit,首先把爱和恨连边,然后我们n^2枚举每两个点通过判断距离来 ...
BZOJ1565 [NOI2009]植物大战僵尸【最大权闭合子图 + tarjan缩点(或拓扑)】
题目输入格式输出格式仅包含一个整数,表示可以获得的最大能源收入.注意,你也可以选择不进行任何攻击,这样能源收入为0. 输入样例 3 2 10 0 20 0 -10 0 -5 1 0 0 100 ...

js日常笔记

js日常笔记的更多相关文章

随机推荐

热门专题