该博客介绍了如何使用jQuery监听文本框的回车事件，当用户按下回车键时，将文本框的内容添加为新的列表项插入到<ul>列表的开头。
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script src="jQuery-2.1.0/jquery-2.1.0.js"></script>
<script>
$(document).ready(function(e) {
$(".te").keydown(function() {//给输入框绑定按键事件
if(event.keyCode == "13") {//判断如果按下的是回车键则执行下面的代码
var sj = $('.te').val();//获取文本框内容
var li = $("<li>"+sj+"</li>");//创建li
$("ul").prepend(li);//添加到ul前方
}
});
});
</script>
</head>
<body>
<input class="te" type="text"/>
<ul>
<li>fghbd</li>
<li>发过火</li>
<li>是贷款年份</li>
<li>低筋粉</li>
<li>啥地方和</li>
<li>每人放技能</li>
</ul>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script src="jQuery-2.1.0/jquery-2.1.0.js"></script>
<script>
$(document).ready(function(e) {
$(".te").keydown(function() {//给输入框绑定按键事件
if(event.keyCode == "13") {//判断如果按下的是回车键则执行下面的代码
var sj = $('.te').val();//获取文本框内容
var li = $("<li>"+sj+"</li>");//创建li
$("ul").prepend(li);//添加到ul前方
}
});
});
</script>
</head>
<body>
<input class="te" type="text"/>
<ul>
<li>fghbd</li>
<li>发过火</li>
<li>是贷款年份</li>
<li>低筋粉</li>
<li>啥地方和</li>
<li>每人放技能</li>
</ul>
</body>
</html>
扫一扫
771
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
