在移动Safari中未触发的li元素中的div的Jquery单击事件

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

Answer 1

向元素添加一个空的onclick属性:

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

链接到描述问题的jQuery问题

Answer 2

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

您要将代码包装在 pageinit 事件中吗？
jQuery 移动事件

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