jQuery在li元素中的div的点击事件在移动版Safari浏览器中无法触发

Question

更新：最终我直接生成元素，而不是由jQuery渲染。

更新2：问题似乎很清楚。我进行了几次测试，只有一个插入链接的事件被触发。但我不想绑定整个li元素，而是li中的div元素。

更新：我对div的位置进行了一些修改，现在在Android上可以使用，但是在移动版本的Safari甚至在ul列表中的任何元素都无法使用。

以下内容适用于桌面版Safari和Chrome，但不适用于它们的移动版本。有什么想法吗？

js：

$('#SubCategories > li .likeRibbon').live('click', function () {
   ......
});

html:

<ul id="SubCategories">
      <li id="st2" >          
       <div class="likeRibbon">Like?</div>
      </li>
</ul>

css:

#SubCategories .likeRibbon
{
    border-style: solid none solid none;
    border-width: 1px 0px 1px 0px;
    border-color: #565656;
    background-color: #565656;
    color: #333;
    text-shadow: 0 1px 0 #777, 0 -1px 0 black;
    line-height: 1;
    padding: 2px 0 5px 0;
    -moz-transform: rotate(-40deg);
    -ms-transform: rotate(-40deg);
    -o-transform: rotate(-40deg);
    -webkit-transform: rotate(-40deg);
    text-align: center;
    vertical-align: baseline;
    position: absolute;
    width: 100px;
    right: -35px;
    bottom: 5px;
}

- William

---

移动浏览器加载页面时，div 是否会旋转？我的意思是在任何点击之前。 - Anthony

抱歉，伙计，我认为旋转与我的更改无关，请查看上面更新的信息，谢谢。 - William

@William，在哪个事件中将点击事件绑定到div？ - Ahmed Atia

我将其绑定在"$ ('＃menulist') .live（'pageinit'，function（event）"中。 - William

@William，请选择正确的答案。我很困惑，因为你对所有答案都评论为好！！或者如果你有另一个答案，请发表它。-谢谢。 - smilyface

Answer 1

将一个空的onclick属性添加到该元素中：

<ul id="SubCategories">
      <li id="st2" >          
       <div onclick="" class="likeRibbon">Like?</div>
      </li>
</ul>

这是指向描述该问题的jQuery问题链接

- steveax

---

从那张票中提出添加 cursor: pointer 的建议相当有趣。 - Douglas

似乎很奇怪，iOS Safari需要onclick =“”属性。光标：指针建议有用吗？对我来说是的 :/ - a11hard

@Adgezaza 我没有进行过广泛的测试，但我已经成功地使用了光标解决方法。 - steveax

我已经阅读了这个问题。我有一个疑问，我们需要在哪里添加cursor:pointer？是在:hover类中还是普通类中？ - smilyface

我在Android浏览器中遇到了这个问题，这个解决方案对我很有用。谢谢。 - Dilhan Jayathilake

Answer 2

对于iOS，只需在该类或ID的CSS中添加

    *.classidentifier*{
      cursor:pointer;
    }

即可解决此问题。

- user1930476

Answer 3

我认为这与您绑定点击事件的方式有关，因为它在桌面浏览器中有效，但在移动浏览器中无效。

您是否应该将代码包装在pageinit事件中？
jQuery Mobile Events

<script type="text/javascript">
 $("#pageID").live('pageinit', function() {
   // do something here...
 });
</script>

- Ahmed Atia

---

@William，请选择正确的答案。我很困惑，因为你对所有答案都评论为好！！ - smilyface

抱歉 @smilyface，这个问题对我来说太久远了，如果你创建一个新的工单，我会看一下。 - William