Question

我有IPhone4s，IPhone5，IPhone5s，它们都运行相同的iOS版本7.1.1（11D201）。但是，以下JQUERY只适用于IPHONE5s。在其他2个IPhones上，click事件根本不会触发。当我改为内联onclick事件时，它在所有手机上都能正常工作。

然而，这很奇怪，因为所有这些IPhones都运行相同版本的iOS，并且可能是移动游戏。

任何想法为什么JQUERY代码在运行相同iOS的IPhones上表现不同？

$('#arrow_offer').on('click', function () {
 if ($("#toggledivoffer").css('display') == "none") {
    $('#toggledivoffer').css('display', 'block');
    $('#arrow_offer').css("background-image","url('images/arrowdown.png')");
 }
 else{
    $('#toggledivoffer').css('display', 'none');
    $('#arrow_offer').css("background-image","url('images/arrow.png')");
 }
});
<p class="arrow" id="arrow_offer"></p>

Answer 1

使用is(':visible')而不是检查display属性。并且还使用.show()和.hide()而不是更改display属性来显示和隐藏元素。

$('#arrow_offer').on('click', function () {
 if (!$("#toggledivoffer").is(':visible')) {
    $('#toggledivoffer').show();
    $('#arrow_offer').css("background-image","url('images/arrowdown.png')");
 }
 else{
    $('#toggledivoffer').hide();
    $('#arrow_offer').css("background-image","url('images/arrow.png')");
 }
});

Answer 2

不确定这种行为有何不同，但我可以建议您切换类/切换div：

 $('#arrow_offer').on('click', function () {
     $('#toggledivoffer').toggle(); // toggles the visibility of div
     $('#arrow_offer').toggleClass("arrow arrowdown"); // toggles the classes
 });

其中css类如下：

.arrow{
  background: url('images/arrow.png');
}
.arrowdown{
  background: url('images/arrowdown.png');
}

jQuery代码在IPHONE 4s，IPHONE 5和IPHONE 5s上表现不同

2 个答案:

Demo