jQuery / mobile Safari bug？

我有一个有趣的问题……我正在尝试制作一个一次只显示3列的表格，并且通过使用左右箭头可以隐藏两个右列并显示2个以上的隐藏列滚动右边的列。

我在这里成功实现了这个目的： http ：//reach4urphone.com/player/weapons ?gamertag = kit001（仅供参考：此代码不再用于此链接，我选择了更兼容的跨浏览器解决方案） 。

问题是，虽然这适用于Chrome，IE9和Safari的最新版本，但它不适用于我的iPhone4或iPad2（我的主要目标平台）。 所以我认为可能有一个jQuery或移动Safari漏洞不支持我的部分实现。 这是我唯一的JQuery代码（请注意，我在第一行使用jQuery UI选项卡，每个选项卡的面板上都有一个表）：

$(document).ready(function () { $("#tabs").tabs(); }); $('#rightArrow').live('click', function () { var curr = $(this).closest('table').find('.selected'); var next = curr.next().next(); if (next.length === 0) next = curr.siblings(':first-child').next(); curr.hide().removeClass('selected').next().hide(); next.show().addClass('selected').next().show(); }); $('#leftArrow').live('click', function () { var curr = $(this).closest('table').find('.selected'); var prev = curr.prev().prev(); if (prev.length === 0) prev = curr.siblings(':last-child').prev(); curr.hide().removeClass('selected').next().hide(); prev.show().addClass('selected').next().show(); }); 

谢谢大家。

Answer 1

您发布的代码实际上与您提供的链接上的源代码不同 – 在onmouseup事件处理程序中没有jQuery绑定，您在站点上使用以下代码：

 var curr = $(window.event.srcElement).closest('table').find('.selected'); 

这在Firefox中不起作用。 尝试将其更改为post中的代码（改为使用此对象），我们将从那里进行调试。

Answer 2

好的，对于那些遇到同样问题的人来说，我已经找到了一些解决方案。 就像我说的，jQuery live（）与移动Safari的兼容性不如此处报告的bug： http ： //bugs.jquery.com/ticket/5677

以前我使用jQuery click（）方法将处理程序绑定到click事件，但是因为我使用AJAX生成了一些内容，所以我需要使用live（）在插入到DOM中的新内容上注册click处理程序。

所以，直到jQuery团队处理这种情况，我才简单地补充说：

 onclick="functionName(this)" 

到我的右箭头和左箭头按钮调用相应的函数，并给我一个被点击的箭头的引用。 正如Christian指出的那样（谢谢），所有浏览器都不支持使用window.event.srcElement。 最后，我意识到这不是“不引人注目的JavaScript”方式，但我不是JavaScript专家，至少现在它会做。

完整资源可以在我的网站上找到@ http://reach4urPhone.com/player/weapons?gamertag=kit001