为什么添加jquery mobile后点击事件绑定两次

我正在处理一个MVC web项目，该项目使用jquery在单击a标记时切换div。它运行良好。然后我将jquery.mobile添加到项目中，现在所有的点击事件都会触发两次。我把点击事件的处理程序吐到控制台上，发现它被绑定了三次，但实际上只触发了两次。我的猜测是jquery和jquery.mobile都是绑定和发射的。

这是HTML:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>Dashboard - Environmental Monitoring System</title>
    <link href="/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    <meta name="viewport" content="width=device-width" />
    <link href="/Content/site.css" rel="stylesheet"/>
    <link href="/Content/jquery.mobile.structure-1.3.1.css" rel="stylesheet"/>
    <link href="/Content/jquery.mobile.theme-1.3.1.css" rel="stylesheet"/>
    <script src="/Scripts/modernizr-2.6.2.js"></script>

    <script src="/Scripts/jquery-1.8.2.js"></script>
    <script src="/Scripts/jquery.mobile-1.3.1.js"></script>
</head>
<body>
    <div id="body">
        <section class="featured" id="feature-header">
            <div class="content-wrapper">
                <hgroup class="title">
                    <h1>Dashboard.</h1><br />
                    <h2>Display the status of all the sensors in the system.</h2>
                </hgroup>
            </div>
        </section>
        <section class="content-wrapper main-content clear-fix">                
            <div>
                <a href="#"style="position:relative;left: 6px;top:-6px;text-decoration:none;background-color:none;" id="feature-header-button"><span class="icon-plus" style="display:none;" id="feature-header-plus">&#9660;</span><span class="icon-minus" id="feature-header-minus">&#9650;</span></a>
                <script>
                    $("#feature-header-button").click(function () {
                        $("#feature-header").slideToggle("slow");
                        $("#feature-header-plus").toggle();
                        $("#feature-header-minus").toggle();
                    });
                </script>
                <div style="margin-left:75px;">
                    Content.
                </div>
            </div>
        </section>
    </div>
</body>
</html>

我可能会将collapsible与jquery.mobile结合使用，这很好，但我想了解这个问题，以防止它在未来引发问题。我已经读了很多关于使用pageinit、双重绑定和冒泡等的帖子，但仍然无法诊断和解决我的问题。谢谢

因此，我在最新版本的jquery和jquery.mobile中都更改了链接，问题消失了。不确定冲突是什么，但jquery版本1.10.2和jquery.mobile版本1.3.2在一起更快乐。现在，让新版本自动包含在MVC捆绑包中。

感谢您的评论，它帮助我解决了故障并提供了健全性检查。

相关内容

最新更新

热门标签：