How to run a function on keypress event

3 Views

I am using wordpress as my cms

and am also devloping a voting system

Read More

This is my jquery for voting function

How can i run this function on keypress event ?

For example if someone press Key “A” this function automatically runs

I did google for atleast half an hour but didnt find any relevant results 

 <script type="text/javascript">
/* <![CDATA[ */ 
(function($) {
 function setCookie(name,value,days) {
 if (days) {
    var date = new Date();
    date.setTime(date.getTime()+(days*24*60*60*1000));
    var expires = "; expires="+date.toGMTString();
}
else var expires = "";
document.cookie = name+"="+value+expires+"; path=/";
}

function getCookie(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
    var c = ca[i];
    while (c.charAt(0)==' ') c = c.substring(1,c.length);
    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
}
return null;
 }

 $(document).ready(function(){
 $("body").on('click', '.vote-btn:not(.disabled)', function () { 
 var el = $(this),
    nonce = $("input#voting_nonce", el.parent()).val(),
    id = el.attr('id').replace(/vote-/, ''); // get the Post ID

 el.html('<span id="loader"></span>');
 var data = {
    action: 'add_votes_options',
    nonce: nonce,
    postid: id,
    ip: '<?php echo $_SERVER['REMOTE_ADDR']; ?>'            
};
 $.post('<?php echo admin_url('admin-ajax.php'); ?>', data,
function(response){
 console.log( response );

     if(response!="-1") {

el.html('<img src="<?php get_bloginfo('url'); ?>/wp- content/themes/9GAG/happysimily.png">').unbind('click').addClass('clickedyellow');
 $('.vote-btn', el.closest('div')).addClass('disabled');
 $("#vote", el.closest('article')).addClass('clickedlove'); 



        if(response=="null") {
            alert("A vote has already been registered to this IP address.");

        } else {
            $("#votecounter", el.closest('article')).html(response); 


        }
        var cookie = getCookie("better_votes");
        if(!cookie) {
            var newcookie = id;
        } else {
            var newcookie = cookie + "," + id;
        }
        setCookie("better_votes", newcookie, 0);
    } else {
        alert("There was a problem registering your vote. Please try again later or enable browser cookies.");
    }

 });

 return false;
});

 })
 })(jQuery);




 /* ]]> */
 </script>
Post Views: 3

Related posts

Leave a Reply

2 comments

  1. Need to add an event listener for keypress (or keyup, keydown, etc)

    $(document).keypress(function(e) {
 if (e.keyCode == 65) {              // "A" key
  //code.... 
 }
});

  2. You can capture keypress in different ways , simple one is use Jquery default one,

    .keypress()

    So you need to assin ur function block to a function name. and this should be inside your document ready function since your voting function is not global and in context of ready only.

    (function($) { 

   var yourVotingFn = function(){
          .........//your code logic
    }

   $(body).keypress(function(event) {
     if ( event.which == 13 ) {//Enter key
       yourVotingFn();
     }
   });

});