Search code examples
androidjquerystoppropagation

jQuery stopPropagation for click on android


I have a "hiddeable" element, it hides when the user click on it, except when the user click in an input text field, the script is very simple:

$('#main_table #sidebar .mini_hid').click(function(){
    $('#main_table #sidebar').removeClass('show');
});
$('#main_table #sidebar .mini_hid input[type="text"]').click(function(e){
    e.stopPropagation();
});

To hide the element I remove the "show" class, and to avoid to trigger it clicking the text field I use a stopPropagation.

This works fine on Computers and Mac, but in Android devices stopPropagation is not working, so when an user clicks on the text field the whole element hides.

I need the stopPropagation() works to avoid hidding its container.


Solution

  • Ok I solved this issue changing the click event for mouseup.

    $('#main_table #sidebar .mini_hid').mouseup(function(){
        $('#main_table #sidebar').removeClass('show');
    });
    $('#main_table #sidebar .mini_hid input[type="text"]').mouseup(function(e){
        e.stopPropagation();
    });
    

    This is not really a full solution but a workaround.