1. ホーム
  2. jquery

[解決済み] jQuery Mobileのボタンを無効にする

2022-02-18 11:03:54

質問

jQuery Mobile用です。通常のjQueryの回答がすべて動作するわけではありません。

jQuery Mobileでボタンを無効にすることができないのですが。

jQuery Mobileでは

$('input').button('disable');   

しかし、Firebugでエラーメッセージが表示されます。

uncaught exception: cannot call methods on button prior to initialization; attempted to call method 'disable'.

私のページのドキュメントレディのセクションにあるので、どうしてまだ初期化されていないのかわかりません。

ボタンを直接idで呼び出してみましたが、うまくいきません。

試してみました。

$('button').attr("disabled", "disabled");

動作しない

また、値が何であるかに基づいて1つのボタンを有効にするswitchコマンドも持っています。その部分は右の "case" ステートメントにルーティングするようにしましたが、jQuery mobile のボタンの有効化/無効化はうまくいきません。

のコードで指定します。 http://pastebin.com/HGSbpAHQ

解決方法は?

UPDATEしてください。

この質問はまだ多くのヒットがあるので、ボタンを無効にする方法について、現在のjQM Docsも追加しています。

例を更新しました。

無効になっているフォームボタンを有効にする

$('[type="submit"]').button('enable');  

フォームボタンを無効化する

$('[type="submit"]').button('disable'); 

フォームを更新するボタン
を使用してフォームボタンを操作する場合 JavaScriptでは、refreshメソッドを呼び出して更新する必要があります。 ビジュアルスタイリング

$('[type="submit"]').button('refresh');

以下、オリジナル記事。

ライブの例 http://jsfiddle.net/XRjh2/2/

UPDATE

以下の@naugturの例を使って。 http://jsfiddle.net/XRjh2/16/

UPDATE #2。

リンクボタンの例です。

JS

var clicked = false;

$('#myButton').click(function() {
    if(clicked === false) {
        $(this).addClass('ui-disabled');
        clicked = true;
        alert('Button is now disabled');
    } 
});

$('#enableButton').click(function() {
    $('#myButton').removeClass('ui-disabled');
    clicked = false; 
});

HTML

<div data-role="page" id="home">
    <div data-role="content">

        <a href="#" data-role="button" id="myButton">Click button</a>
        <a href="#" data-role="button" id="enableButton">Enable button</a>

    </div>
</div>

注意:- http://jquerymobile.com/demos/1.0rc2/docs/buttons/buttons-types.html

<ブロッククオート

ボタンのようにスタイルされたリンクは、真の意味でのリンクと同じビジュアル・オプションを持ちます。 のようなフォームベースのボタンがありますが、いくつかの重要な違いがあります。 リンクベースのボタンは、ボタンプラグインの一部ではなく、単に ボタンスタイルを生成するための基礎となるbuttonMarkupプラグインを使用しています。 フォームボタンのメソッド(enable, disable, refresh)はサポートされていません。 リンクベースのボタン (または任意の要素) を無効にする必要がある場合、以下の方法があります。 無効化クラス ui-disabled を自分で適用することができます。 JavaScriptで同じ効果を得ることができます。