JS常用小结

您目前处于：笔记 2017-07-31

乔淑夷

乔淑夷，从事京麦工作台前端架构及开发工作，熟练运用h5，css3，js，jquery等前端技术，熟悉vue，angular等开源框架。

开发过程中我们遇到的一些JS的问题，总结一下，未完待续 ……

1. 滚动条滚动到页面容器底部，设置滚动条距离顶部的高度为容器内容高度和容器可视区域高度的差，并添加动画。

var obj = document.getElementById('msgList');  
if(obj.scrollHeight > obj.clientHeight){  
    $(obj).animate({  
        scrollTop: obj.scrollHeight - obj.clientHeight  
    },600);  
}

2. H5唤起客户端APP

通过a标签打开，有些浏览器会直接跳转错误页

<a herf="JDWorkStation://command=open"></a>

通过iframe打开

var url = 'JDWorkStation://command=open';  
var ifr = document.createElement("iframe");  
ifr.src = url; /***打开app的协议***/  
ifr.style.display = "none";  
document.body.appendChild(ifr);  
window.setTimeout(function(){  
    document.body.removeChild(ifr);  
},500);

3. IE8浏览器，a标签作为button点击时浏览器会无视href属性，需要设置点击事件event.preventDefault()

4. JS判断单击软键盘的“完成”按钮（enter提交表单）

方法一：模拟表单提交

在input外面包上一个form标签，当用户在表单中单击搜索或完成会触发表单的submit事件，所以在submit事件中去处理搜索的逻辑，并阻止表单的提交

<form action="" id="form">  
  <input type="text">  
</form>

$('#form').submit(function(){  
  // 处理相关逻辑  
  return false;  
})

方法二：用keypress事件

移动端的软键盘也是支持keypress、keydown、keyup事件的，完成的event.keyCode是13，和键盘上的回车键一样

<input type="text" id ="txt">

$("#txt").keypress(function(e){  
  if(e.keyCode === 13) {  
    // 处理相关逻辑  
  }  
})

Reference

http://blog.csdn.net/oucqsy/article/details/76147250