ajax POST に接続された jQuery モバイル ボタンがあります。POST が失敗した場合、jQuery モバイル ボタンは「ポップアップ」せずに押されたままになります。
3 に答える
簡単にできます。
jsFiddle
これは私の以前の回答の1つに対して作成された例です: http://jsfiddle.net/3PhKZ/7/
見てみると、次のコード行があります。
$.mobile.activePage.find('.ui-btn-active').removeClass('ui-btn-active ui-focus');
現在アクティブなページで押されたボタンを見つけようとします。成功すると、ボタンが押された状態を担当する 2 つのクラスが削除されます。残念ながら、純粋な CSS ソリューションはここでは不可能です。この例をテストできます。最初の行にコメントを付けて、何が起こるかを確認してください。
最後のセレクタ $.mobile.activePage は、pagebeforeshow、pageshow、pagebeforechange、pagechange、pagebeforehide、および pagehide ページ イベント中にのみ使用できるため、これを考慮に入れます。
このセレクターを使用できない場合は、次のようにページ ID に置き換えてください。
$('#pageID').find('.ui-btn-active').removeClass('ui-btn-active ui-focus');
したがって、最終的なコードは次のようになります。
$.ajax( "example.php" )
.success(function() { doStuff(); })
.error(function() {
$('#pageID').find('.ui-btn-active').removeClass('ui-btn-active ui-focus');
})
ボタンを元に戻すエラー句を AJAX 処理に追加します。
$.ajax( "example.php" )
.success(function() { doStuff(); })
.error(function() { /*code to unpress button here*/ })
ボタンとして「アンカー」ではなく「入力」を使用している人々のために。たとえば、「送信」ボタンと「リセット」ボタンを使用してそれらを押すと、ボタンがクリックされたときに実行されるアクションによっては望ましくない場合があります。
それが予想される動作であるかどうかはわかりません.jQueryモバイルのバグであると読みましたが、少なくともjQM 1.3.2にはまだ動作が存在します.
はい、トリックは述べたようにアクティブなクラスを削除することですが、クラスが入力タグに追加されていないため、それらはトリッキーになります。 i* t は親 DIV * に追加されます。これが、入力を選択するときにアクティブなクラスを削除しても機能しない理由です。
jquery mobile によって生成された HTML を分析することによる回避策は次のとおりです。
実際の入力要素ではなく、入力親のアクティブなクラスを削除します。
$('.mybutton_class_or_ID').parent().removeClass('ui-btn-active');
クラスの削除をより選択的にしたい場合に備えて、ページ全体ですべてのアクティブなクラスをクリアするのではなく、このアプローチを好みます。