Why doesn't this jquery function work on iPhone OS?

Question

The following jquery works fine in most desktop browsers, but fails on android and iphone browsers:

$('#submit_event').live('click', function() {

    if ($("#event_name").attr("value") != "" && $("#event_details").attr("value") != ""){
        sendEvent($("#event_name").attr("value"), $("#event_details").attr("value"));
        $('#response_container').append("<div class='event_title'>"+$("#event_name").attr("value")+"</div><div class='event_details'>"+$("#event_details").attr("value")+"<div class='comment'>Comment</div><textarea class='comment_area'></textarea><div id='post_comment'>Post</div></div>");
    }
});

The #submit_event is just the ID to a div. When clicked, it runs the function on desktop browsers, but not android or iphone.

regards,

taylor

Answer 1

You could try more efficient code:

$('#submit_event').live('click', function() {

    var eName = $("#event_name").attr('value');
    var eDetails = $("#event_details").attr('value');

    if (eName && eDetails) {
        sendEvent(eName, eDetails);
        $('#response_container').append("<div class='event_title'>" +
            eName + 
            "</div><div class='event_details'>" +
            eDetails + 
            "..."
        );
    }
});

Answer 2

Ok I found my answer,

It's just a bug in mobile safari.

All you need to do is add onclick='' to any element that you bind the live function to and it will work.

Answer 3

Yes .live event will not work with element like td. It will work with html element like anchor tag, button etc. So if you want to apply click event using .live event of jQuery you need to first add onclick="" attribute using jquery .attr method on your td element and then apply .live event to bind event with your td element. For more detail please visit on below blog

http://skillfulness.blogspot.com/2010/11/workaround-for-jquery-live-event.html

Answer 4

If you are using jquery mobile too, you might want to try

$('#submit_event').live('tap', function() {}