7

I am using jquery mobile click function, however, it is not working.

Here is an example of the button that I have, and it is contained within a grid:

<div class="ui-block-c"><a class="request" data-role="button" data-id="\"'+json[i].num+'\" data-type="3" data-icon="plus" data-iconpos="right">Test</a></div>

jQuery function:

$('.request').on('click', function() {
    alert("hi");
});

How do I fix this?

2
  • 1
    It's working here Sep 6, 2013 at 18:50
  • Are you sure that you bind when the element has already been loaded ? That's not the right way to use on. Sep 6, 2013 at 18:51

2 Answers 2

17

It looks like you are adding this element dynamically, so you'll need to use a delegated event listener:

$(document).on('click', '.request', function() {
    alert("hi");
});

Also you have an issue with your escaped quotes not matching. I don't think those are necessary:

<div class="ui-block-c"><a class="request" data-role="button" data-id="'+json[i].num+'" data-type="3" data-icon="plus" data-iconpos="right">Test</a></div>
5
  • this works, however, the formatting to the button is lost, do you know how to approach that?
    – nshah
    Sep 6, 2013 at 18:53
  • the quotes are fine, because the html code is within quotes '', because it is later being appended by jquery
    – nshah
    Sep 6, 2013 at 18:54
  • 1
    What formatting is lost? As for the quotes, your question had an odd number of quote characters, which isn't valid HTML and will cause you rendering issues. This may be the source of your formatting problems.
    – cfs
    Sep 6, 2013 at 18:56
  • Your solution works, but why the other way of adding the event $('.request').on('click') won't work ? I had the same issue and would like to understand the cause. Jul 27, 2017 at 17:10
  • The request element doesn't exist, so you can't bind an event to it. You might want to read up on event delegation to see how to solve the problem: learn.jquery.com/events/event-delegation
    – cfs
    Aug 8, 2017 at 18:17
-4
$(.request).click(function(){
alert("hi")
});
5
  • 5
    Hi Jack, welcome to Stackoverflow! Please explain your answers with words also. Why you think this should be the answer. In case you gave a answer that does not work you can delete it or edit it. But nice with some words explaining your idea. Cheers!
    – Sergio
    Sep 6, 2013 at 19:00
  • In this case I don't think also changing to .click() would make a difference or be the solution to this question.
    – Sergio
    Sep 6, 2013 at 19:01
  • Wow! You guys are harsh, i was only trying to help :(
    – Jack Tuck
    Sep 6, 2013 at 19:07
  • 1
    Jack, don't take it personally :)
    – Sergio
    Sep 6, 2013 at 19:08
  • 2
    This is a great community and the way to say I disagree is to downvote. You can always edit or delete your answer. And keep on! you are very welcome in SO
    – Sergio
    Sep 6, 2013 at 19:09

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.