0

jquery mobileを使用していますが、ブラックベリープレイブックで問題が発生しました。$ .mobile.changePage（'/ full / url / to / page'）;を使用してjquerymobileでjqueryを介して動的にロードしているページがあります。

ページが読み込まれると、pageinitイベントがキャプチャされ、作業内容を以下で確認できます...

<div id="Page1">
<select id="selectId">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
</select>
</div>
...

$("#Page1").live('pageinit', function () {

  $("#selectId").val("1");
  $("#selectId").selectmenu("refresh", true);
});

これは、Blackberry Playbookを除いて、iOS、Chrome、Androidなどで正常に機能します。

プレイブックでは、Web Inspectorをアタッチした後、selectオブジェクトを再フォーマットしようとしたときにjqueryライブラリがロードされていないように見えるこのjavascriptエラーが発生します...

TypeError: Result of expression 'span.text( text ).addClass' [undefined] is not a function.
code.jquery.com/mobile/latest/jquery.mobile.js:8107

（http://jquerymobile.com/demos/1.1.1/docs/api/events.htmlからの指示に従って）

また、メインのインデックスページでこれを試し、ドキュメントのpageinitにロードすると、完全に正常に機能することに気付きました。

$(document).bind("pageinit", function () {
    $("#test").val("2");
    $("#test").selectmenu("refresh", true);
});

私の「ライブ」イベントが機能しない理由を明らかにすることができたら、私に知らせてください。

（ライブが1.7で非推奨になったことは承知していますが、ajaxページ呼び出しでjquery mobileに使用する他のドキュメントは見つかりませんでした）

ありがとう

4

2 に答える 2

2

探しているのは、委任されたイベントハンドラーです。$([selector]).live([event], [callback])と同じ$(document).on([event], [callback])です。基本的.live()に、要素に委任されたイベントハンドラーを設定しdocumentます。.on()（jQuery 1.7+）または（jQuery 1.4.2 +）を使用.delegate()すると、ルート要素（DOMに常に存在する必要がある要素）を選択できるという追加の利点が得られ、コードの実行速度が向上します。

jQuery 1.7以降：

$(document).on("pageinit", "#Page1", function () {
    $(this).find("#selectId").val("1").selectmenu("refresh", true);
});

ドキュメント：http ：//api.jquery.com/on

jQuery 1.4.2 +

$(document).delegate("#Page1", "pageinit", function () {
    $(this).find("#selectId").val("1").selectmenu("refresh", true);
});

ドキュメント：http ：//api.jquery.com/delegate

補足：jQuery 1.7以降を使用し.delegate()ていて、新しいメソッド.live()を利用する単なるショートカットである場合。.on()

アップデート

http://code.jquery.com/mobile/latest/jquery.mobile.jsの8107行目に関連付けられているコードブロックは次のとおりです。

...
setButtonText: function() {
    var self = this,
        selected = this.selected(),
        text = this.placeholder,
        span = $( document.createElement( "span" ) );

    this.button.find( ".ui-btn-text" ).html(function() {
        if ( selected.length ) {
            text = selected.map(function() {
                return $( this ).text();
            }).get().join( ", " );
        } else {
            text = self.placeholder;
        }

        // TODO possibly aggregate multiple select option classes
        return span.text( text )
            .addClass( self.select.attr( "class" ) )//line 8107 right here
            .addClass( selected.attr( "class" ) );
    });
},
...
于 2012-08-24T20:02:54.790 に答える
0

それを理解した、自分のせい。次のシナリオでは、オプションに存在しない値を設定しようとしていると想像してください...

<div id="Page1">
<select id="selectId">
<option value="0">0</option>
<option value="1">1</option>
<option value="2">2</option>
</select>
</div>
...

$("#Page1").live('pageinit', function () {

$("#selectId").val("notHere");
  $("#selectId").selectmenu("refresh", true);
});

このシナリオでは、jqueryが機能しなくなります。教訓として、「更新」を実行する前に、必ずオプションのホワイトリストを確認してください。

于 2012-08-27T15:57:40.993 に答える