jQuery Mobileで有効なフォームの送信ボタンを有効にします。

Question

jQuery Mobile、ボタン、フォームについて多くのドキュメントを読んでいますが、すべてを理解していません。したがって、フォームの応答が無効になるまで、送信ボタンを無効にしたいと思います。

ここに私の作業コードがある...

$(document).ready(function() 
{ 
    /* $('#submit').button('enable') */ /* Console says "Uncaught TypeError: Object [object Object] has no method 'button'" */ 
    $('#submit').attr("disabled", true); 
    /* Do stuff */ 
    $('#form').live('keyup change', function() 
    { 
    if (isEmailValid && isTextValid) 
    { 
     /* $('#submit').attr("disabled", false); */ /* Button is not enable */ 
     $('#submit').button('enable'); 
    } 
    }); 
}) 
... 
<div class="content-primary"> 
    <form id="form"> 
    <button data-theme="a" id="submit" type="submit">Submit</button> 
    </form> 
</div> 

私のコードは、クロム、FirefoxとInternet Explorerで働いているが、私はロジックを理解していない：私はオフにして、別々に提出をオンにします！

私の解決策は正しいですか？

ありがとうございました。

乾杯、

V.

Answer 1

あなたが送信ボタンウィジェットを有効および無効にするjQueryのモバイルbutton()機能を使用することができます。ここでは

$(document).delegate('[data-role="page"]', 'pageinit', function() { 
    var $submit = $(this).find('#submit'), 
     $text = $(this).find('input[type="text"]'); 
    $text.bind('keyup', function() { 
     if (this.value == '') { 
      $submit.button('disable'); 
     } else { 
      $submit.button('enable'); 
     } 
    }).trigger('keyup'); 
}); 

はデモです：http://jsfiddle.net/tewV6/

また、jQuery Mobileを使用しているときにdocument.readyイベントハンドラを使用したくない場合もあります。代わりに上記の例のようにdata-role="page"要素をターゲットにしてpageinitを使用してください。