jquery mobileネストされたボタンのクリックイベントを追加する

ネストされたボタンがあり、その上にクリックイベントを追加しようとしていますが、動作していないようです。jquery mobileネストされたボタンのクリックイベントを追加する

は、これは私のオブジェクト

$("#ui-50 .ui-rpC#rpc-eor").click(function(){ 
    alert("yay!"); 
});

が、イベントの文句を言わない火を使用して、ID = "RPC-EOR" ボタンをクリックイベントを追加しようと

<div id="ui-50"> 
<div class="ui-rpc" data-role="controlgroup" data-type="horizontal" > 
    <input type="button" id="rpc-bor" value="<<" /> 
    <input type="button" id="rpc-back" value="<" /> 
    <span style="margin:3px"></span> 
    <input type="text" id="rpc-jump" value="" /> 
    <input type="button" id="rpc-next" value=">" /> 
    <input type="button" id="rpc-eor" value=">>" /> 
    <span style="margin:20px"></span> 
    <label id="rpc-current" >0</label> 
    <label id="rpc-separator" >/</label> 
    <label id="rpc-total" >0</label> 
    <span style="margin:20px"></span> 
    <label id="rpc-rpp" >0</label> 
</div> 
</div>

イムです。何か問題でもありますか？助けてください！事前のおかげ

は

出典

2011-07-21 Chinchan Zu

を試してみてください？ありがとう。 – andyb

私が使用して、私はChromeで走ったこのデモでは、予想通りconsole.log出力を見ていjQuery.mobile 1.0b1

<!DOCTYPE html> 
<html> 
    <head> 
    <title>Page Title</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.css" /> 
    <script src="http://code.jquery.com/jquery-1.6.1.min.js"></script> 
    <script src="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.js"></script> 
    <script type="text/javascript"> 
    $(document).ready(function() { 
     $("div:jqmData(role='page')").live('pageshow',function(){ 
      $("#ui-50 .ui-rpC#rpc-eor").click(function(){ 
       console.log("yay!"); 
      }); 
     }); 
    }); 
    </script> 
</head> 
<body> 
<div data-role="page" id="home"> 
    <div data-role="header"> 
     <h1>Header</h1> 
    </div> 
    <div data-role="content"> 
     <div id="ui-50"> 
      <div class="ui-rpc" data-role="controlgroup" data-type="horizontal" > 
       <input type="button" id="rpc-bor" value="<<" /> 
       <input type="button" id="rpc-back" value="<" /> 
       <span style="margin:3px"></span> 
       <input type="text" id="rpc-jump" value="" /> 
       <input type="button" id="rpc-next" value=">" /> 
       <input type="button" id="rpc-eor" value=">>" /> 
       <span style="margin:20px"></span> 
       <label id="rpc-current" >0</label> 
       <label id="rpc-separator" >/</label> 
       <label id="rpc-total" >0</label> 
       <span style="margin:20px"></span> 
       <label id="rpc-rpp" >0</label> 
      </div> 
     </div> 
    </div> 
</div> 
</body> 
</html>

注：あなただけdocument.ready()その後、でのjQueryをラップしている場合there is no document.ready() for jQuery.mobileは、それは可能性がありますあなたの問題を引き起こしている。 $("div:jqmData(role='page')").live('pageshow',...);にバインドして、ページの準備が整ったことを保証する方がよいでしょう。つまり、この単純なケースでは、まだ.liveバインドなしで動作します。

出典

2011-07-21 11:07:31 andyb

はjQuery.mobileのバージョンを使用しているIDのみ

$("#rpc-eor").click(function(){ 
    alert("yay!"); 
});

出典

2011-07-21 12:55:58

はい、これも機能するはずです。私は私の問題を発見した。私はCSSのアルファ版を使用しました。ベータ版に変更したときにコードが動作します。ご協力ありがとうございました –

jquery mobileネストされたボタンのクリックイベントを追加する

答えて

関連する問題