Program Club

'클릭'및 '입력'시 이벤트 트리거

proclub 2020. 10. 31. 10:17
반응형

'클릭'및 '입력'시 이벤트 트리거


내 사이트에 검색 창이 있습니다. 현재 사용자는 jquery의 게시물을 통해 검색하려면 상자 옆에있는 제출 버튼을 클릭해야합니다. 사용자도 Enter 키를 눌러 검색 할 수 있도록하고 싶습니다. 어떻게 할 수 있습니까?

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버튼을 찾으십시오 . 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()한 다음 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');
    }
});

$('#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
}

문서로드시 아래의 키 누르기 이벤트를 사용할 수 있습니다.

 $(document).keypress(function(e) {
            if(e.which == 13) {
               yourfunction();
            }
        });

감사


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

반응형