js进阶 12-16 jquery如何实现通过点击按钮和按下组合键两种方式提交留言

js进阶 12-16 jquery如何实现通过点击按钮和按下组合键两种方式提交留言

一、总结

一句话总结:实现按下组合键提交留言是通过给input加keydown事件,判断按键的键码来实现的。

1、如何判断同时按下了ctrl键和回车键?

25         $('#txt1').keydown(function(e){
26 if (e.which==13&&e.ctrlKey) {

2、实现组合按键提交留言时候的事件监听对象是谁?

input 文本框

25         $('#txt1').keydown(function(e){
26 if (e.which==13&&e.ctrlKey) {

3、如何实现按下组合键提交留言?

实现按下组合键提交留言是通过给input加keydown事件,判断按键的键码来实现的。

25         $('#txt1').keydown(function(e){
26 if (e.which==13&&e.ctrlKey) {
27 var str1=$('#txt1').val()
28 var str2=$('#txt2').val()
29 str2+=str1+'\n'
30 $('#txt2').val(str2)
31 $('#txt1').val('')
32 }
33 })

4、回车键和ctrl键的键码分别是多少?

13 和 e.ctrlKey

26             if (e.which==13&&e.ctrlKey) {

二、jquery如何实现通过点击按钮和按下组合键两种方式提交留言

1、相关知识

提交留言

案例描述:通过点击按钮和按下组合键两种方式提交留言.

案例重点:该案例本身非常简单,目的在于提高大家应用学过的知识点解决实际的问题的能力。

 

2、代码

 <!DOCTYPE html>
<html lang="en">
<style>
</style>
<head>
<meta charset="UTF-8">
<title>演示文档</title>
<script type="text/javascript" src="jquery-3.1.1.min.js"></script>
<style type="text/css">
#txt1,textarea{width: 200px}
</style>
</style>
</head>
<body>
<input type="text" id="txt1"><br><input id="btn1" type="button" value="提交"><br>
<textarea id="txt2" rows="10" cols="30"></textarea><br>
<script>
$('#btn1').click(function(){
var str1=$('#txt1').val()
var str2=$('#txt2').val()
str2+=str1+'\n'
$('#txt2').val(str2)
$('#txt1').val('')
})
$('#txt1').keydown(function(e){
if (e.which==13&&e.ctrlKey) {
var str1=$('#txt1').val()
var str2=$('#txt2').val()
str2+=str1+'\n'
$('#txt2').val(str2)
$('#txt1').val('')
}
})
</script>
</body>
</html>
 
上一篇:移植u-boot-1.1.6之mtdparts分区


下一篇:MS SQL Server中的CONVERT日期格式化大全