0

我在 jQuery mobile 中实现了一个多选菜单。我想在回调函数中引用所有选定的项目(理想情况下,它将由 close 事件触发)。下面说明的实现通常适用于将数据绑定到单个项目菜单的更改处理程序,但它甚至似乎都没有触发。任何帮助,将不胜感激。

<head>
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0-rc.1/jquery.mobile-1.1.0-rc.1.min.css"
    />
    <link rel="stylesheet" href="../_assets/css/jqm-docs.css" />
    <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script src="http://code.jquery.com/jquery-1.5.1.min.js">
        < /script
            <meta http-equiv="Content-Type" content="text/html;
        charset = UTF - 8 "/>
            <meta name="
        viewport " content="
        width = device - width, user - scalable = no " />

</head>

<body onload="
        initialize()">
    <script type="
        text / javascript ">

        $(document).ready(function () {
            $("#selectMenu ").on("change ", {testdata: "test "}, filterSelectHandler);
        }); 

    function filterSelectHandler(e) {
    alert($(": selected ", $(this)));
    }

    </script>
    <div data-role="page">
        <div data-role="header"></div>
        <div data-role="content">
            <select name="select-choice-1" id="selectMenu" multiple="multiple" data-native-menu="false">
                <option value="standard">Option 1</option>
                <option value="rush">Option 2</option>
                <option value="express">Option 3</option>
                <option value="overnight">Option 4</option>
            </select>
        </div>
    </div>
    </body>

4

1 回答 1

0

从您正在使用的旧版 JQM 开始,但不匹配 css:

<script type="text/javascript" src="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.js"></script>
try this one instead:
<script type="text/javascript" src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>

您包括 3 次 jquery 和不同的版本。只留下这个:

<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>

将脚本放在头部区域以及使用 JQM 使用“pageinit”事件时,最好的做法是:

<script type="text/javascript">
    $(document).on("pageinit", function() {
        $("#selectMenu").on("change", filterSelectHandler); 
        function filterSelectHandler(e) {
            alert($(":selected", $(this)));
        }
    });

</script>
于 2012-06-17T16:22:52.230 回答