- 获取手机端屏幕宽高(根据头部高度和底部高度动态设置页面体高度)
//网页可见区域宽:document.body.clientWidth
//网页可见区域高:document.body.clientHeight
//网页可见区域宽:document.body.offsetWidth (包括边线的宽)
//网页可见区域高:document.body.offsetHeight (包括边线的宽)
//网页正文全文宽:document.body.scrollWidth
//网页正文全文高:document.body.scrollHeight
//网页被卷去的高:document.body.scrollTop
//网页被卷去的左:document.body.scrollLeft
//网页正文部分上:window.screenTop
//网页正文部分左:window.screenLeft
//屏幕分辨率的高:window.screen.height
//屏幕分辨率的宽:window.screen.width
//屏幕可用工作区高度:window.screen.availHeight
//屏幕可用工作区宽度:window.screen.availWidth
/*自动计算并设置内容窗体高度,用户自动适应所有页面布局开始 */
//入参:顶部容器ID、底部容器ID、要计算高度容器ID
function resizePageBodyHeight(topId,bottomId,resetId){
var totalHeight = document.body.clientHeight;
//alert(totalHeight);
var topHeight = $("#"+topId).css("height");
//alert(parseFloat(topHeight));
var bottomHeight = $("#"+bottomId).css("height");
//alert(parseFloat(bottomHeight));
//alert(parseFloat(totalHeight)-parseFloat(topHeight)-parseFloat(bottomHeight));
$("#"+resetId).css("height",parseFloat(totalHeight)-parseFloat(topHeight)-parseFloat(bottomHeight));
}
-
自动为输入框添加清除图片并实现点击清空输入框值
CSS代码(具体的样式需要自己实现,此处仅为参考):.clearImg{ display:none; width: 0.24rem; height: 0.24rem; float: right; margin-top: -0.33rem; z-index: 30; position: inherit; margin-right: 0.1rem; }
HTML和JQ代码:
<input name="userId" id="userId" type="text" required="required" placeholder="请输入用户名" class="formInput" > <img alt="" src="imgs/clean.png" class="clearImg imgOne"> /*自动为输入框增加清除输入图片开始 */ $('input').bind('input propertychange', function() { var name = $(this).val(); if(""!=name){ $(this).next().css("display","block"); }else{ $(this).next().css("display","none"); } }); $(".clearImg").on("tap"