반응형
'클릭' 및 '엔터'에서 이벤트를 트리거
제 사이트에 검색창이 있습니다.현재 사용자는 jquery의 게시물을 통해 검색하려면 상자 옆에 있는 제출 버튼을 클릭해야 합니다.사용자들도 entry를 눌러 검색할 수 있도록 하고 싶습니다.이거 어떻게 해요?
JQuery:
$('document').ready(function(){
$('#searchButton').click(function(){
var search = $('#usersSearch').val();
$.post('../searchusers.php',{search: search},function(response){
$('#userSearchResultsTable').html(response);
});
});
});
HTML:
<input type='text' id='usersSearch' /><input type='button' id='searchButton' value='search' />
사용하다keypress에 관한 사건.usersSearch텍스트 상자에서 단추를 찾습니다.Enter 버튼을 누르면 나머지 작업을 수행하는 검색 버튼 클릭 이벤트가 발생합니다.이거 먹어봐요.
$('document').ready(function(){
$('#searchButton').click(function(){
var search = $('#usersSearch').val();
$.post('../searchusers.php',{search: search},function(response){
$('#userSearchResultsTable').html(response);
});
})
$('#usersSearch').keypress(function(e){
if(e.which == 13){//Enter key pressed
$('#searchButton').click();//Trigger search button click event
}
});
});
다음을 사용하여 두 이벤트 수신기를 호출합니다..on()그다음에 a를 사용합니다.if기능 내부:
$(function(){
$('#searchButton').on('keypress click', function(e){
var search = $('#usersSearch').val();
if (e.which === 13 || e.type === 'click') {
$.post('../searchusers.php', {search: search}, function (response) {
$('#userSearchResultsTable').html(response);
});
}
});
});
이와 같은 것이 효과가 있을 것입니다.
$('#usersSearch').keypress(function(ev){
if (ev.which === 13)
$('#searchButton').click();
});
$('#form').keydown(function(e){
if (e.keyCode === 13) { // If Enter key pressed
$(this).trigger('submit');
}
});
문서 로드 시 키 누름의 아래 이벤트를 사용할 수 있습니다.
$(document).keypress(function(e) {
if(e.which == 13) {
yourfunction();
}
});
감사해요.
$('#usersSearch').keyup(function() { // handle keyup event on search input field
var key = e.which || e.keyCode; // store browser agnostic keycode
if(key == 13)
$(this).closest('form').submit(); // submit parent form
}
한 번 봐봐요.keypress 기능을 합니다.
제 생각에는.enter키는13그래서 당신은 다음과 같은 것을 원할 것입니다.
$('#searchButton').keypress(function(e){
if(e.which == 13){ //Enter is key 13
//Do something
}
});
언급URL : https://stackoverflow.com/questions/9146651/trigger-an-event-on-click-and-enter
반응형
'programing' 카테고리의 다른 글
| 싱글클릭 이벤트와 더블클릭 이벤트를 구분하는 방법은? (0) | 2023.11.01 |
|---|---|
| C# XmlDocument가 실행되는 이유.XML 헤더가 포함된 경우 LoadXml( 문자열)이 실패합니까? (0) | 2023.11.01 |
| Laravel Debugbar를 안전하게 제거하는 방법 (0) | 2023.11.01 |
| get_the_post_thumbnail에서 이미지 소스 가져오기($post->ID); (0) | 2023.11.01 |
| 워드프레스 플러그인 끝점에 REST 경로를 등록할 위치 (0) | 2023.11.01 |