Why javascript press enter button no function?

Question

I am working on a text field which is pressable with "enter" button but unfortunately it does not work. I am trying following code inside my project.

This is my JavaScript code:

<script>
$(document).ready(function() {  
    // Live Search
    // On Search Submit and Get Results
    function search() {
        var query_value = $('input#search').val();
        $('b#search-string').html(query_value);
        if(query_value !== ''){
            $.ajax({
                type: "POST",
                url: "search.php",
                data: { query: query_value },
                cache: false,
                success: function(html){
                    $("ul#results").html(html);
                }
            });
        }
            return false;    
    }

    $("input#search").live("keyup", function(e) {
        var theSearch = $('#search');
        // Set Timeout
        clearTimeout($.data(this, 'timer'));

        // Set Search String
        var search_string = $(this).val();

        // Do Search
        if (search_string == '') {
            $("ul#results").fadeOut();
            $('h4#results-text').fadeOut();
        }else{
            $("ul#results").fadeIn();
            $('h4#results-text').fadeIn();
            $(this).data('timer', setTimeout(search, 0));
        };
    });

});

    $("#search").on('keyup',function(e){
    var text = document.getElementById("search").value;
    if(text !== ""){
        if (e.which == 13){
            $("#btnSearch").click();
        }
    }   
});

function doSomething(){
    var text = document.getElementById("search").value;
    window.location.assign("search.php?value = " + text);
}
});

</script>

This is my HTML code:

<input type="text" id="search">
<input type="button" id="btnSearch" onclick="doSomething();" />

<script> tags....because it seems to be working as expected jsfiddle.net/LPnDD — asprin
– asprin, Commented May 27, 2014 at 4:33
@RashminJaviya : I am doing search function inside my code and its work well. I just wanna to addin additional function when I key in value inside in my text field and it will redirect me to a new page which will show relevant result for what I am key in inside my text field. — user3517652
– user3517652, Commented May 27, 2014 at 4:35

jhyap · Accepted Answer · 2014-05-27 04:52:01Z

2

use unique selector id

$("#search").on('keyup',function(e){

    if (e.which == 13){
        alert('abc');
    }
});

demo jsfiddle

use input type selector

$('input[type=text]').each(function(i,e) {

    $("#"+e.id).on('keyup',function(e){

        if (e.which == 13){
            alert('abc');
        }
    });
});

another demo

edited May 27, 2014 at 4:52

answered May 27, 2014 at 4:38

jhyap

3,8496 gold badges30 silver badges49 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

user3517652 Over a year ago

its work well at jsfiddle but when I dump your code inside my project it cannot work.

user3517652 Over a year ago

when i press on enter button it did not prompt out alert box/

jhyap Over a year ago

do you remove your original $("input[type=text]").on('keyup',function(event){ code ?

user3517652 Over a year ago

yap. Actually I used your code before I post on here and its also cannot work.

jhyap Over a year ago

remove your .live and try my solution to diagnosis the problem.

user2587132 · Accepted Answer · 2014-05-27 04:47:49Z

1

Place $("input[type=text]").on... inside $(document).ready and make sure you are using JQuery version before 1.7 If you wish to use live

answered May 27, 2014 at 4:47

user2587132

4 Comments

Shameel Kadannamanna Over a year ago

I think your answer is the solution

jhyap Over a year ago

Verified. the problem came from .live

user3517652 Over a year ago

I have updated my code where it cannot work when I replace "alert('abc')" to "$('#btnSearch').click()". click function cannot work. Hope you can give me another solution.

user2587132 Over a year ago

@user3517652, Place doSomething function before document.ready

Jeetendra Chauhan · Accepted Answer · 2014-05-27 05:07:15Z

0

change your html to

  <form onsubmit="doSomething();" >
   <input type="text" id="search">
   <input type="submit" id="btnSearch"  />
  </form>

while using this you don't have to listen enter key event your doSomething() function will be called automatically on enter press in input field

DEMO

answered May 27, 2014 at 5:07

Jeetendra Chauhan

1,9772 gold badges15 silver badges21 bronze badges

Collectives™ on Stack Overflow

Why javascript press enter button no function?

3 Answers 3

5 Comments

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

5 Comments

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related