几个前端可能会遇到的小问题
怎样让文字不能被选中:
.select-none{ /*取消选取文字效果*/ -moz-user-select:none; -webkit-user-select: none; -ms-user-select: none; }
input有个黄色的背景去不掉???有下拉提示去不掉???
禁用input的自动完成功能就可以了,有两种方法:
1、html中:
<input type="text" autocomplete="off">
2、在css中:
input:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px white inset; }
display属性为inline-block的元素无法再使用visibility:hidden
overflow:hidden兼容ie:
在使用overflow:hidden;兼容低版本的ie7和ie8的时候,常常会出现无效的情况,overflow:hidden只能兼容ie9,10,11版本较高的IE解决办法是在当前父盒子加上posision:relative;
兼容ie背景图,background-size问题:
background:url('../images/active.png') 0 0 no-repeat; background-size:100% 100% ; color:#3a3e7a; /*针对IE8的hack,目的是除掉之前background*/ background: none\9; /*下一行为关键设置*/ filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/active.png', sizingMethod='scale');
加了vertical-align会使元素元素相对于基线向下偏移两像素
导致左右不能水平对齐:
vertical-align:middle;
iphone上不触发事件
写了一个下拉菜单,在单击空白地方的时候隐藏。
用$(document).click(function(){ ... });
结果在iPhone上的不会触发事件,原因是Safari中处理事件冒泡的规则不一样:
点击某个DIV,事件会冒泡到body下面的子节点为止,还是事件对象处理该事件的话,就把该事件丢弃掉,不再往上冒泡。
解决办法就是在body的下级,写个空函数接收一下事件。就行了。
$("body").children().click(function () { // 这里不要写任何代码 });
js写一个动态创建并提交form表单的方法
var url=$(this).attr('url'); var id=$(this).attr('id'); var type=$(this).attr('type'); function download(url, method, id, type){ $('<form action="'+url+'" method="'+(method || 'post')+'">' + // action请求路径及推送方法 '<input type="text" name="id" value="'+id+'"/>' + // 文件路径 '<input type="text" name="type" value="'+type+'"/>' + // 文件名称 '</form>') .appendTo('body').submit().remove(); }; download(url, 'get', id, type);