jquery mobile在嵌套按鈕上添加單擊事件

我有一個嵌套按鈕，並試圖添加點擊事件，但它似乎沒有工作。jquery mobile在嵌套按鈕上添加單擊事件

這是我的目的是使用

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

但該事件不會火

<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>

我嘗試在ID = 「RPC-EOR」按鈕添加click事件。有什麼事？請幫忙！在此先感謝

來源

2011-07-21 Chinchan Zu

哪個jQuery.mobile的版本，您使用的是ID？ – 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>

注：there is no document.ready() for jQuery.mobile因此，如果您在包裹了jQuery只是document.ready()，那麼它可能導致你的問題。最好綁定$("div:jqmData(role='page')").live('pageshow',...);以保證頁面已準備就緒。這就是說，在這種簡單的情況下，它仍然可以在沒有綁定的情況下運行。

來源

2011-07-21 11:07:31 andyb

嘗試僅僅

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

來源

2011-07-21 12:55:58

謝謝。是的，這也應該起作用。我發現了我的問題。我使用了alpha版本的css，當我將其更改爲測試版本時，我的代碼工作正常！感謝您的支持 –

jquery mobile在嵌套按鈕上添加單擊事件

回答

相關問題