1

I use this simple code for when click in div, check input checked, and also change color when i do click over div

My code :

  <div class="container_item" onclick="$('.check_<?php echo $pd;?>').attr('checked','checked');$('.drop_container_item').removeClass('drop_click');$(this).addClass('drop_click');">Test Click</div>

The problem it´s in all browsers works, but in mobile device don´t works, for example when i use un mobile devices, change the color of div, but don´t works the check

You can test here :

https://jsfiddle.net/aqnz3vc9/

I try other posibilities but i haven´t luck about this ways, thank´s in advanced for the help, regards

1 Answers1

0

Firstly you shouldn't use inline event handler as they are very outdated and no longer best practice.

As you're using jQuery attach your event handlers unobtrusively. If you use on() you can hook to both the click and touch events which will then work for desktop and mobile devices. Try this:

<div class="drop_container_item">Click Now</div>
<input type="radio" class="check" name="veritas" value="yes">
jQuery(function($) {
  $('.drop_container_item').on('click touch', function() {
    $('.check').prop('checked', true);
    $('.drop_container_item').removeClass('drop_click');
    $(this).addClass('drop_click')
  });
});
Rory McCrossan
  • 331,213
  • 40
  • 305
  • 339
  • Really very strange the problem really was use attr for get checked in mobile device don´t works but yes , works use prop, really strange, but thank´s for your help the problem finally no onclick the problem wa use attr, regards ! :) – Alfredo Aguin Figueiro Aug 15 '19 at 09:17
  • Glad it worked, but the advice is still sound; don't use `onclick`. – Rory McCrossan Aug 15 '19 at 09:19