jQuery删除和添加类不适用于iPhone

Question

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");
  }
});

Answer 1

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!