简体   繁体   中英

jquery remove and addclass doesn't work on iphone

I have 2 divs. One is the label div, the other one is the input div. When I toggle the label div, the input div is toggling. I am also closing the input div by clicking anywhere on the screen. Everything works fine, but nothing works on an iPhone.

. yoket {
  display: none;
}
$(document).mouseup(function(e) {
  var label = $("#semt");
  var container1 = $("#semt1");

  if (label.has(e.target).length === 1) {
    if (container1.hasClass("yoket")) {
      container1.removeClass("yoket");
    } else if (!container1.hasClass("yoket")) {
      container1.addClass("yoket");
    }
  } else if (container1.has(e.target).length === 0) {
    container1.addClass("yoket");
  }
});

The reason it is not working for mobile(or any touch based device) is because the mouseup event is not fired, Please switch to click and/or touchend events to it. Ideally this should work.

$(document).bind("mouseup touchend",function(e) {
  var label = $("#semt");
  var container1 = $("#semt1");

  if (label.has(e.target).length === 1) {
    if (container1.hasClass("yoket")) {
      container1.removeClass("yoket");
    } else if (!container1.hasClass("yoket")) {
      container1.addClass("yoket");
    }
  } else if (container1.has(e.target).length === 0) {
    container1.addClass("yoket");
  }
});

Hope this helps!

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM