ansaurus

Question

Answer 1

+1 A:

What means could't work ? do you have that code inside a function that is executed onload ? like..

$(document).ready(myfunction)

Rodrigo Asensio 2009-12-03 17:32:46

Yes. Of course I have placed it in side $(document)...

2009-12-03 17:34:35

Answer 2

+1 A:

You need to trigger this code to load: I.e. wrap your statement

$(function(){
  $('div > input').click(function(){
              alert(1);             
  });
});

Which will trigger it when the JQuery is ready on the page load.

Michael Gattuso 2009-12-03 17:33:00

Answer 3

+1 A:

Make sure your code is put inside of a callback for $(document).ready(..):

$(document).ready(function(){
    $('div > input').click(function(){
        alert(1);             
    });
});

JasonWyatt 2009-12-03 17:33:21

Ah crap, beaten by @Rodrigo Aensio by 30 seconds.. :)

JasonWyatt 2009-12-03 17:33:53

Answer 4

A:

works here. Are you sure your code is called after the document is loaded? like

$(function() {
 $('div > input').click(function(){
             alert(1);             
 });
})

stereofrog 2009-12-03 17:34:07

Answer 5

+2 A:

How is the script above embedded into the page? How is it invoked?

You should place it in the head section of your HTML like this:

<html>
<head>
  <title>blah</title>
  <script type="text/javascript">
  $(function()
  {
    $('div > input').click(function(){
      alert(1);             
    });
  });
  </script>
</head>
<body>
  ...
</body>
</html>

Lior Cohen 2009-12-03 17:35:02

Answer 6

+4 A:

New answer (based on question edit): If you have elements being added after you register event listeners, these listeners will not apply to those elements (event listeners are explicitly added to individual DOM nodes, not to "selectors" which the DOM really knows nothing about). The easiest solution to this is to use jQuery's live method:

$('div > input').live('click', function() { ... });

live uses a basic implementation of event delegation: the click event, received by the document DOM node, has bubbled up from div > input and jQuery will trigger your event listener for that element when the event bubbles up.

Old answer: Are you sure the selectors are the failure point? Try $('div > input').css({ border: '1px solid red' }); and see if the elements in question are affected. If they are, chances are some earlier-registered click handlers are using event.preventDefault() or some other means of preventing your listeners from being triggered.

eyelidlessness 2009-12-03 17:55:28

Absolutely right. Thanks so much :D :D

2009-12-03 18:16:34

Answer 7

A:

Cycle through the different elements using "each" and assign the click event. This works:

   $(document).ready(function() {
       $('div > input').each(function() {
     $(this).click(function(){
                alert(1);             
     });
      });
   });

Rich Reuter 2009-12-03 18:03:29

Where should I put this? if inside $(document)... then it doesn't work also. I've just tried. Thanks. :D

2009-12-03 18:07:36

That won't solve the problem if the `<input>` in question isn't in the document at the time. See the revised question.

eyelidlessness 2009-12-03 18:10:35

Put it in a function and call it after you dynamically add the elements into the page.

Rich Reuter 2009-12-04 13:56:55

ansaurus

tags:

views:

answers:

Jquery selectors behave oddly

related questions