项目中的日常随记~~不定期更新

1.隐藏内容

display:none;  是内容、空间都隐藏，不会占地方。

visibility: hidden; 是内容隐藏、但是会留有这个元素所占的空间。

2.复制文本框中的内容

<input type="text" value="u换个色ui给我" id="textInput"><input type="button" onClick="copytest()" value="复制" /><script type="text/javascript">function copytest(){var copy2=document.getElementById("textInput");copy2.select();// 选择对象document.execCommand("Copy"); // 执行浏览器复制命令alert("复制完成，使用ctrl+v粘贴复制的内容");}</script>

已测试兼容ie、火狐、谷歌浏览器~~注意不要给文本框添加disable属性，要不会使复制功能失效，如果要禁止用户输入的话加上readonly只读熟悉就可以了，不需要用到disable了。。

复制这个功能刚发现一个缺陷就是当文本框或者文本域隐藏时，他会获取不到里面的值，从而失效，不过可以用css的一个属性opacity:0;通过把文本框隐藏来实现即隐藏了文本框里又可以复制里面的值。

3.使用function函数传参（变量）。

    $(function(){    var hahaha = {"name":"张三","age":3,"sex":"男"};//注意函数传参过后会变成字符串格式，所以如果要传值的话应先使用点语法获取到，然后传过去。    var hahahaStr = hahaha.name;    $("ul li").append("<a class='aaa' onclick='byValue(this,\""+hahahaStr+"\")'>函数传参示例</a>");    })function byValue(obj,val){        var obj = obj;        var val = val;        // var valObj = '{"name":"张三","age":3,"sex":"男"}';        // JSON.parse(valObj);        console.log(val);        // console.log(typeof(val));}

有时我们需要即传this又传变量时，变量可以用\""+变量+"\"的方法来实现，而且尤为注意的是如果你传的变量是一个对象的话，传过去后会输出字符串object而不是你的值了，所以可以先把值从对象中用点语法取出来变成字符串传过去。

4.echarts图表插件之饼图的位置设置

直接在series:[{center["30%","50%"]}]属性，其中第一个百分比为left值，即饼图距容器的left，第二个值为top值。

5.当单选框或复选框选中时执行回调函数

    <input type="radio" name="sex" id="sex1"><label for="sex1">男</label>    <input type="radio" name="sex" id="sex0"><label for="sex0">女</label>    <button class="submit">提交</button>    <script>        $(function(){            $(".submit").click(function(){                if($("#sex1").is(":checked")){                    //当选择男时触发的函数                    alert("你选择的是男");                }                if($("#sex0").is(":checked")){                    //当选择女时触发的函数                    alert("你选择的是女");                }              })        })    </script>   

6.meta标签使360浏览器自动切换为webkit内核访问

若页面需默认用极速核，增加标签：<meta name=”renderer” content=”webkit” />

若页面需默认用ie兼容内核，增加标签：<meta name=”renderer” content=”ie-comp” /> 

若页面需默认用ie标准内核，增加标签：<meta name=”renderer” content=”ie-stand” /> 

content的取值为webkit,ie-comp,ie-stand之一，区分大小写，分别代表用webkit内核，IE兼容内核，IE标准内核。注意结尾应为“ />”（/ 前面有空格）。

7. echarts表格横坐标文字的倾斜。

其实需要写的就俩个属性，很简单。第一个是在xAis:[{axisLabel:{interval:0,rotate:60}}]里写的。interval是显示横坐标个数，如何写0的话会强制显示所有的横坐标，如果写1的话会隔一个显示一个，以此类推。rotate属性就是控制横坐标名称的旋转角度，写的是number类型。还有一个就是如果你用到放大缩小显示横坐标的显示区间的话，就需要用到这个和xAis平级的grid属性，是这样写的gird:{y2:110}。

gird属性改之前：（横坐标名字与时间轴重合了）

改之后：

8.获取鼠标所在浏览器中的位置

                    //鼠标跟随事件    var e = arguments.callee.caller.arguments[0] || window.event;    var pointX=e.pageX+5;    var pointY=e.pageY+5;    alert(pointX+'   '+pointY);

把上面代码写进点击事件中，就会在鼠标点击时获取到当前鼠标的位置，一般用于鼠标跟随功能和右键菜单。

9.内容超出div的宽度时自动换行

word-wrap:break-word; 
word-break:break-all; 

overflow: hidden;  overflow一定要根据项目的实际情况来写~比如有竖向滚动条时就不能写hidden而是auto了。

10.jq里mouseout和mouseleave的区别。

  不论鼠标指针离开被选元素还是任何子元素，都会触发 mouseout 事件。这也是我们平常用mouseout时鼠标明明还没有离开被选元素时要展现的元素却一直闪烁。那是因为写有mouseover时使元素显示mouseout时使元素隐藏。但鼠标轻轻移动时离开了被选元素的子元素，因此会一直隐藏，显示次数多了就一直闪烁了~~~此时应用下面那个事件来代替mouseout。

   只有在鼠标指针离开被选元素时，才会触发 mouseleave 事件。

11. table里的tBodies。

        在js中可以直接写document.getElementById(table).tBodies[0]直接获取到该table的tbody，里面是所有的tr，td。可以通过tBodies[0].rows[0].cells[0]取到table里的一个td也可以通过insertRow和insertCell插入tr和td。