Question

我正在使用jQuery ui手风琴。我想在每个手风琴小组活动时显示div中的引号。我似乎无法让它发挥作用。有任何想法吗？我正在尝试这样的事情......

pd.merge_asof(dfa, dfb, 'datetime')

if ($("#section1").hasClass("ui-accordion-content-active")) {
            $("#quote1").show();}

我离得更近了，但还需要一些帮助。我已将html更改为以下内容：

<div id="quote1"><em>quote1</em></p></div>
<div id="accordion">
 <h3>Section 1</h3>
  <div id="section1" class="sec1">
    <p>
    Mauris mauris ante, blandit et, ultrices a, suscitait eget.
    </p>

这是jQuery：

<div class="subcontent" id="123"><em>quote1</em></p></div>
<div class="subcontent" id="124"><em>quote2</em></p></div>


<div id="accordion">
<h3>Section 1</h3>

 <div data-id="123" class="topic">
 <p>
 Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. 
 ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum 
 amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra 
 </p>
 </div>
 <h3 id="section2">Section 2</h3>
 <div data-id="124" class="topic">
 <p>
 Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit 
 purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis 
</p>
</div></div>

没有“点击”功能，这不起作用。无论如何，报价出现时没有“点击”功能？

Answer 1

这是你可以做的，我不知道它是否非常干净

HTML

 $( function() {

$( "#accordion" ).accordion({
    active: false,
    collapsible: true, });

$("h3").click(function(){
        if($(".topic").hasClass("ui-accordion-content-active") == true) {
         $('.subcontent:visible').hide();
      $('.mainquote:visible').hide();
    console.log($(this).data("id"));  
    $('.subcontent[id='+$(this).data("id")+']').delay(500).fadeIn(); 
 } else {
              $('.subcontent:visible').hide(); }

})
;});

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>

<link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet"/>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<div class="subcontent" id="123"><em>quote1</em></div>
<div class="subcontent" id="124"><em>quote2</em></div>


<div id="accordion">
<h3 data-id="123">Section 1</h3>

 <div   class="topic">
 <p>
 Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. 
 ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum 
 amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra 
 </p>
 </div>
 <h3 data-id="124"id="section2">Section 2</h3>
 <div  class="topic">
 <p>
 Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit 
 purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis 
</p>
</div></div>

jQuery Accordion ui - 当面板处于活动状态时显示/隐藏另一个div

1 个答案: