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 的用户应该使用 .delegate() 而不是 .live()

  3. h3class的元素内部没有子元素ui-collapsible-content,实际上元素内部只有文本h3

  4. 确保您拥有最新版本,因为对于一些较旧的事件,似乎存在与该pageinit事件相关的一些问题。确保事件被执行。

于 2013-01-09T14:38:27.497 回答