3

コードは次のとおりです: これは XML からデータを取得したものです (これは機能し、jQuery なしで既にテスト済みです)。

 <script>
        $(document).ready(function(){
            var select = $('#mySelect');

            $.ajax({
                type: "GET",
                url: "http://mobile.qmschrysant.nl/keuzemenu/keuzemenu.xml",
                dataType: "xml",
                success: function(xml) {
                $(xml).find('menuitem').each(function(){
                    var title = $(this).find('title').text();
                    select.append("<option/><option class='ddheader'>"+title+"</option>");
                        $(this).find('value').each(function(){
                        var value = $(this).text();
                        select.append("<option class='ddindent' value='"+ value +"'>"+value+"</option>");

                        });
                    });
                    select.children(":first").text("please make a selection").attr("selected",true);
                    select.trigger('updatelayout');
                }
            });
        });
     </script>

これは私の選択オプションです（HTML）：

<label for="selectmenu" class="select">Kies planning:</label>
          <form>
            <select id="mySelect" >

                <option>loading</option>
            </select>
          </form>

このjQueryスクリプトを含めると、奇妙なことに：

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

その後、ドロップリストは見栄えが良くなりましたが、情報は含まれていません。
その行をコメントアウトすると、ドロップリストは正常に見えますが、情報が含まれるようになりました（これが機能することの証明です）。

しかし、jQuery の行を含めると機能しないのはなぜですか? 問題が見つかりません。

(おそらくより良い説明については、写真を参照してください) ここに画像の説明を入力

編集:私が使用するすべてのインクルード:

<link href="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.css" rel="stylesheet" type="text/css">
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
4

3 に答える 3

1

jquery の 2 倍のインポートがあります。

<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>

最も古いもの (2 行目) を削除します。

または、両方の行を次のように置き換えてください。

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

(jquery mobile を含める前)

そう ：

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<link href="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.css" rel="stylesheet" type="text/css">
<script src="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.js" type="text/javascript"></script>
于 2012-06-12T08:06:16.500 に答える
1

OP「最新のjquery mobile.jsを使用したところ、すべてが完全に機能するようになりました」.

これは互換性の問題のようでした。

かわった：

<script src="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.js" type="text/javascript"></script>
<link href="http://code.jquery.com/mobile/1.0a3/jquery.mobile-1.0a3.min.css" rel="stylesheet" type="text/css">

に：

<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js" type="text/javascript"></script>
<link href="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.css" rel="stylesheet" type="text/css">
于 2012-06-12T08:46:53.283 に答える