JS中onkeydown, onkeyup, onblur 三个事件对比，并js实现判断文本框是否为空和按Enter键实现Tab换行
1、onkeydown, onkeyup, onblur
onkeydown: 是按下键盘中某个键时触发
onkeyup: 是按下键盘中某个键并弹起时触发
最明显的是Textbox 当光标在Textbox上，你按下'a'键时
onkeydown是先响应其中事件，事件响应完了之后把'a'赋值给Textbox
onkeyup是先把'a'赋值给Textbox, 后响应其中的事件
onblur: 是切换光标时触发
2、判断文本框是否为空
//name: 提示信息
//stxt: 要判断的控件ID
function checkisnull(name, stxt){
var str = document.getElementById(stxt)
if(str.value.length == 0){
alert(name.toString() + "不能为空")
document.getElementById(stxt).focus()
}
}
按下Enter键进行换行
function totab(){
if(window.event.keyCode == 13){
window.event.keyCode = 9
//keycode为13是Enter键 9是Tab键
}
}
3、在实际使用中
<asp:TextBox
ID="wTxt_JCTitle" onkeydown="totab()" onblur="checkisnull('本卷标题
','wTxt_JCTitle')" runat="server"
Font-Size="20pt"></asp:TextBox>
这里分享下js判断当前选中哪个是tab页的方法。
设备：联想电脑
系统：win7
软件：Visual Studio 2017
1、首先来看一下要实现的效果，如下图所示，顶上是tab页卡，下面是内容。
2、然后准备页面的内容，如下图所示，tab运用ul布局，内容运用div布局。
3、接下来就是去除页面中的一些默认间距以及ul的list-style样式，如下图所示。
4、然后定义tab页卡以及内容的相关样式，如下图所示。
5、接着导入所需要的jquery的压缩库文件，如下图所示，版本大家自己选择。
6、最后就是实现选择一个页卡，然后展现页卡内内容的方法，JS实现tab页卡主要是运用了mouseenter的事件方法进行控制显示。
<!DOCTYPE html><html>
<head>
<title></title>
<script language="javascript" type="text/javascript">
window.onload = function () {
var oTxt = document.getElementById("txt")
oTxt.onkeydown = function (ev) {
var oEvent = ev || event
if (oEvent.keyCode == 9) {
/*关键部分 开始(重要! 去掉浏览器的默认事件 不然会按tab之后光标会跳去其他的地方,用户优化不好)*/
if (oEvent.preventDefault) {
oEvent.preventDefault()
}
else {
window.event.returnValue = false
}
/*关键部分 结束*/
oTxt.value += ""//这里放入了4个空格
}
}
}
</script>
</head>
<body>
<form>
<textarea cols="30" rows="20" id="txt"></textarea>
</form>
</body>
</html>
