0

jQuery Mobile を使用しており、次の html があります。

<ul id="thelist" data-corners= "false" >
<div class = "theListItem" data-role="collapsible-set" data-collapsed="false">

<div data-role="collapsible" data-collapsed="false" data-theme="a">
 <h3>$1.48   -  10/31/2012   -   niko Reade #14410  -  Brooklyn Ny</h3>
 <div data-role="controlgroup"  data-type="horizontal">
  <a class= "green" href="categorize.html" data-transition="slide"  data-direction="reverse" data-role="button">Yes</a>
  <a class="red" href="#" data-role="button">No</a>
  <a class= "blue" href="IDontKnow.html" data-transition="slide"data-role="button">I don't know</a>
 </div>
 </div>
</ul>

ドロップダウンをアニメーション化しようとしていますが、選択に問題があります。これが私のJSです： 

$('#transPage, #categorizePage, #IDKPage').live('pageinit', function() {
$('.trans .theListItem h3').click(function() {
     var  $controlGroup = $(this).children('.ui-collapsible-content').css("background-color", "#ff3333");
});
});

.ui-collapsible-content は CSS ではうまく機能しますが、JS で使用しようとすると機能しません。セレクターが間違っている理由と、折りたたみ可能なコンテンツをアニメーション化する方法はありますか? ありがとう。

4

1 に答える 1

0
  1. HTML マークアップが正しくありません。最後に締めくくりがありません</div>。

  2. .live廃止されました。ここを参照してください。

    jQuery 1.7 以降、.live() メソッドは非推奨になりました。.on() を使用して、イベント ハンドラーをアタッチします。
    古いバージョンの jQuery のユーザーは、.live() よりも .delegate() を使用する必要があります。

  3. h3class を持つ要素内に子要素はありませんui-collapsible-content。実際、要素内にはテキストのみがありますh3。

  4. いくつかの古いバージョンのイベントに関連する問題pageinitがあるように見えるため、最新バージョンであることを確認してください。イベントが実行されることを確認します。

于 2013-01-09T14:38:27.497 に答える