JQuery滑块和iui（iphone）之间的冲突答案

【问题标题】：conflict between JQuery slider and iui (iphone)JQuery滑块和iui（iphone）之间的冲突
【发布时间】：2009-08-28 11:02:09
【问题描述】：

我试图在 iphone 网络应用程序上获得一个滑块，我正在使用 iui 来处理用户界面。滑块似乎与 iui.js 发生某种冲突，当您拖动滑块时，它会尝试打开另一个页面。但是，当您单击栏的某些部分时，它可以正常工作。我认为这是导致它的幻灯片事件，但在这两种情况下都会触发此事件，所以我有点卡住了。任何帮助将不胜感激。

简单的测试用例（点击进入滑块）：

<head>
    <meta name="viewport" content="width=320; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>

    <script type="application/x-javascript" src="http://www.joehewitt.com/iui/iui/iui.js"></script>
    <link href="http://www.joehewitt.com/iui/iui/iui.css" type="text/css" rel="stylesheet" />

    <script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.3.2.js"></script>
    <script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.core.js"></script>
    <script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.slider.js"></script>
    <link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" />

    <script language="javascript">
        $(document).ready(function(){
            $("#slider").slider()
        });
    </script>
</head>
<body>
    <div class="toolbar">
        <h1 id="pageTitle"></h1>
        <a id="backButton" class="button" href="#"></a>
    </div>
    <ul title="slider test" selected="true">

        <li class="group">Page 1</li>       
        <li>
            <a class="mainnav" href="#page2">page 2</a>
        </li>
</ul>
    <div id="page2" title="foo.inc">
        <div id="slide_container">
            <div id="slider"></div>
        </div>
    </div>
</body>

【问题讨论】：

标签： jquery iphone slider web-applications iui

【解决方案1】：

我对iui不熟悉，但是当你写的时候：

但在这两种情况下都会触发此事件

我认为您遗漏了一些东西（这可能很好地解释了您的问题）。如果您查看滑块的代码，您会发现鼠标拖动确实触发了一组不同的事件。看看“_mouseCapture”和“_mouseDrag”。 _mouseDrag 确实会触发“_slide”，但它也会首先触发“_normValueFromMouse”。至于“_mouseCapture”，它并没有直接连接在滑块代码中（显然它是通过一些通用的 jQuery UI 代码完成的），所以我不能确定它是否涉及，但根据名称似乎很可能是的。

无论如何，_mouseDrag,_normValueFromMouse，或者可能是_mouseCapture（或他们调用的某些函数）似乎无意中调用了某些 iui 函数。我的猜测是 iui 连接了一个与滑块/jQuery UI 函数同名的函数，并且在 jQuery UI 连接它的东西之后这样做，结果幻灯片调用了 iui 函数。

想象一下，如果在 jQuery UI 中定义了一个“goSomewhere”函数，然后由_mouseDrag 调用。通常它可以正常工作，但如果有人 (iui) 定义了自己的“goSomewhere”函数，则该函数将被 _mouseDrag 调用。

另外，问题可能是滑块代码调用的内容不会导致正常导航到另一个页面，但会在 iPhone 登陆；但是，我怀疑情况并非如此。

希望对您有所帮助。

【讨论】：

【解决方案2】：

感谢机器鬼的帮助。万一其他人有这个问题，它是由 iui 函数“addEventListener”拾取滑块上的点击引起的。它试图在标签“#”上设置选定的属性，这会破坏页面。您可以在允许此操作继续之前检查标签是否为真实标签，这不是一个完美的修复，但它可以工作。

【讨论】：