JQuery click() event listener not working

Question

im trying to get a lil project going but im stuck on a very annoying thing.

$(document).ready(function() {
  $("#search-button").click(console.log('hello'))
});

as you can see im targeting a search button with the id search-button and as soon as i click it something should happen. in this case i put a console.log in to test if it works but it doesn't. it always logs it as soon as i load the page , not when i click the button i target. ... what am i doing wrong if you need more info on this pls tell me i tried to keep it as simple as i could

ty for your help

O.k

he77kat_ · Accepted Answer · 2018-05-20 01:45:14Z

1

The click handler needs a function argument, not just the console.log by itself. Try this:

$(document).ready(function() {
  $("#search-button").click(function() {
      console.log('hello');
  });
});

answered May 20, 2018 at 1:45

he77kat_

4934 silver badges12 bronze badges

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

Comments

wazz · Accepted Answer · 2018-05-20 01:44:36Z

0

Inside of .click should be a handler .click(handler) and the handler should be a function. The browser is reading the code and when it hits console.log('hello'), it does it! It's seeing .click etc, but it doesn't matter; it next sees console.log and does it.

Try

$(document).ready(function() {
  $("#search-button").click(function() {
    console.log('hello');
  });
});

answered May 20, 2018 at 1:44

wazz

5,0885 gold badges22 silver badges36 bronze badges

Comments

Cybernetic · Accepted Answer · 2018-05-20 01:51:25Z

0

As others have mentioned, the click function requires its own callback function. You can also use this, without requiring the use of document:

$("#search-button").on('click', function() {
    console.log('hello')
    })

answered May 20, 2018 at 1:51

Cybernetic

13.4k16 gold badges108 silver badges153 bronze badges

Comments

Md. Abu Sayed · Accepted Answer · 2018-05-20 05:33:34Z

0

I hope You're using jQuery version 3 or up. if you use 3 or up jquery version the good practice is you use Document binding Example:

jQuery(document).on('click', '#search-button', function(event) {
    //your Code here...
    console.log('hello');
 });

answered May 20, 2018 at 5:33

Md. Abu Sayed

2,5363 gold badges21 silver badges30 bronze badges

1 Comment

Md. Abu Sayed Over a year ago

jQuery(document).on('event'... use for dynamically event binding. element. click event or normal click event work only when window load But you load dynamic document then use 'on' binding or document binding.

Collectives™ on Stack Overflow

JQuery click() event listener not working

4 Answers 4

Comments

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related