按下回車鍵執(zhí)行事件需要使用監(jiān)聽鍵盤按鍵來實(shí)現(xiàn),然后就和普通的事件綁定一樣寫處理事件函數(shù)即可。
成都創(chuàng)新互聯(lián)公司是專業(yè)的龍井網(wǎng)站建設(shè)公司,龍井接單;提供成都做網(wǎng)站、成都網(wǎng)站制作,網(wǎng)頁設(shè)計(jì),網(wǎng)站設(shè)計(jì),建網(wǎng)站,PHP網(wǎng)站建設(shè)等專業(yè)做網(wǎng)站服務(wù);采用PHP框架,可快速的進(jìn)行龍井網(wǎng)站開發(fā)網(wǎng)頁制作和功能擴(kuò)展;專業(yè)做搜索引擎喜愛的網(wǎng)站,專業(yè)的做網(wǎng)站團(tuán)隊(duì),希望更多企業(yè)前來合作!
工具原料:編輯器、瀏覽器
1、實(shí)現(xiàn)一個(gè)按鍵事件,按下回車鍵觸發(fā)一個(gè)處理函數(shù),簡單的代碼示例如下:
1
2
3
4
5
6
7
8
9
body
input type="text" id="searchvalue" value="" /
script type="text/javascript"
$("#searchvalue").keydown(function() {//給輸入框綁定按鍵事件
if(event.keyCode == "13") {//判斷如果按下的是回車鍵則執(zhí)行下面的代碼
alert('按下了回車鍵');//彈出提示信息
}
})
/script
當(dāng)用戶按下enter鍵時(shí)觸發(fā)from提交,而不只是點(diǎn)擊提交按鈕才提交!這樣更友好。 13表示enter按鍵的keyCode編碼
jquery的鍵盤事件分為keypress、keydown和keyup事件
一、鍵盤事件
1、keypress()事件
keypress當(dāng)按鈕被按下時(shí),會(huì)發(fā)生該事件,我們可以理解為按下并抬起同一個(gè)按鍵。
2、keydown()事件
當(dāng)按鈕被按下時(shí),發(fā)生 keydown 事件(多用于游戲開發(fā),比如一直按空格鍵進(jìn)行攻擊)。
3、keyup事件
keyup 事件會(huì)在按鍵釋放時(shí)觸發(fā),也就是你按下鍵盤起來后的事件
二、通過鍵盤事件可以進(jìn)行相應(yīng)操作
$(document).ready(function() {
//釋放按鍵時(shí)
$(document).keyup(function(event){
if(event.keyCode=="13"){ //13表示回車鍵的代碼
alert("釋放按鍵");
}
})
//按下按鍵時(shí)
$(document).keydown(function(event){
if(event.keyCode=="13"){
alert("按下按鍵");
}
})
//輸入字符時(shí)
$(document).keypress(function(event){
if(event.keyCode=="13"){
alert("輸入字符");
}
})
//獲取鍵盤的 鍵碼值 方法(如果不知道某個(gè)鍵對(duì)應(yīng)的 鍵碼值,可用這個(gè)方法,在鍵盤上按該鍵,就會(huì)彈出對(duì)應(yīng)的值 )
$(document).keyup(function(event){
alert(event.keyCode);
})
});
$("#輸入框id").keyup(function(){
if(event.keyCode == 13){
//這里寫你要執(zhí)行的事件;
}
});
擴(kuò)展資料:
JQuery簡單的按鈕點(diǎn)擊和文本框輸入事件
%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%
%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%
!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
html
head
base href="%=basePath%"
titleMy JSP 'test.jsp' starting page/title
meta http-equiv="pragma" content="no-cache"
meta http-equiv="cache-control" content="no-cache"
meta http-equiv="expires" content="0"?
meta http-equiv="keywords" content="keyword1,keyword2,keyword3"
meta http-equiv="description" content="This is my page"
!--
link rel="stylesheet" type="text/css" href="styles.css"
--
script type="text/javascript" src="script/jquery-1.8.3.min.js"/script
script type="text/javascript"
$(document).ready(function(){
$("#clickme").click(function(){
alert("Hello World? click");
});
$('#clickmebind').bind("click", function(){
alert("Hello World? bind");
});
$('#clickmeon').on('click', function(){
alert("Hello World? on");
});
});
/script
script type="text/javascript"
//使用id的方式獲取
$(document).ready(function(){
//1
$("#button_text1").click(function(){
var result1 = $("#input_text1").val();
alert("result1 = " + result1);
});
//2
$("#button_text2").click(function(){
var result2 = $("input[id='input_text2']").val();
alert("result2 = " + result2);
});
//3
$("#button_text3").click(function(){
var result3 = $("input[id='input_text3']").attr("value");
alert("result3 = " + result3);
});
//4. 可以通過type的值來獲取input中的值(未演示)
/*
$("#button_text4").click(function(){
var result4 = $("input[type='text']").val();
alert("result4 = " + result4);
});
*/
//5. 可以通過name的值來獲取input中的值(未演示)
/*
$("#button_text5").click(function(){
var result5 = $("input[name='text']").val();
alert("result5 = " + result5);
});? ? ? ? ?
*/
});
/script
/head
body
h1根據(jù)ID來判定/h1
input type="button" name="clickmes"? id="clickme"? ?value="click me" /
input type="button" name="clickmebinds" id="clickmebind"? value="clickme_bind" /
input type="button" name="clickmeons" id="clickmeon"? value="clickme_on" /
!-- 獲取文本框的值:方式一 --
div id="test1"
input id="input_text1" type="text" value="test1" style="width: 100px;" /
button id="button_text1"test1/button
/div
!-- 獲取文本框的值:方式二 --
div id="test2"
input id="input_text2" type="text" value="test2" style="width: 100px;" /
button id="button_text2"test2/button
/div
!-- 獲取文本框的值:方式三 --
div id="test3"
input id="input_text3" type="text" value="test3" style="width: 100px;" /
button id="button_text3"test3/button
/div
/body
/html
按 回車 鍵時(shí) 觸發(fā)指定按鈕進(jìn)行的操作就好把,比如說 button1 是 form1 提交, 那么當(dāng)用戶按回車鍵時(shí) 就通過js把form1提交了就好
樓主你想實(shí)現(xiàn)什么功能?其實(shí)你所說的有點(diǎn)問題,你寫的那個(gè)方法是在文本框值發(fā)生改變的時(shí)候?qū)懙模@時(shí)候你敲回車,其實(shí)相當(dāng)于直接點(diǎn)按鈕提交頁面,在這之前,文本框失去交點(diǎn),這時(shí)候文本框的值跟原來的就會(huì)不同,觸發(fā)change事件,接著觸發(fā)click事件,這是理所應(yīng)該的
我是想做這樣的操作
element.onclick=function(e){
02020202 回車事件;
//在這里自動(dòng)觸發(fā)一次回車,相當(dāng)于做了一個(gè)單擊操作后,用戶按了回車鍵,其實(shí)用戶沒有按回車
02020202 其他處理}02問題補(bǔ)充:
1. $(elem).keydown(function(event){
2. if(event.keyCode==13){
3. //doSth
4. }
不知道大家明不明白我的意思問題補(bǔ)充:我這個(gè)需求是在jqgrid的工具條中使用的,增加了一個(gè)按鈕,按鈕事件如下:
onClickButton:function(){
//因?yàn)樵诰庉媑rid cell的時(shí)候,如果不按回車,或者焦點(diǎn)離開正在編輯的
//cell,jqgrid認(rèn)為這一個(gè)cell 沒有被修改過,所以在這里我想觸發(fā)一個(gè)回車事件
//使焦點(diǎn)所在的cell變成已編輯狀態(tài),這樣下面的cc中才能獲取到完整的修改過的//cell
//在此處增加自動(dòng)觸發(fā)回車,而非用戶按回車鍵
var cc = jQuery("#info").getChangedCells();//獲取所有修改過的cell
if(cc.length =0){
alert('沒有修改的數(shù)據(jù)');
jQuery.ajax({});//這幾做一個(gè)ajax提交數(shù)據(jù),實(shí)現(xiàn)就不寫了}