Question

嗨朋友们我尝试学习jquery但是我遇到了一些问题，图片下面的红色标签 - 当我点击它切换打开但是当我再次点击第二个时，第一个div打开

我的HTML

static

toggle.js

package classtest;

public class ClassTest {
    // Should I put the path here?
    public static void main(String[] args) {
        String dirPath = "C:/Users/test1/"; 
        String pathOut = "C:/Users/stats.csv"; 
        // or here?
    }   
}

我的错误是什么？

和codepen链接：

<ul class="otel-filtre-fiyat-tab">
                    <li class="otel-views"><a href="#"><img src="http://anitur.streamprovider.net/images/otel-filtre/d2.png" alt="" class="memnuniyet-durum" />
                        <strong>88/100</strong>
                        <span class="otel-goruntuleme">274 Görüntüleme</span>
                    </a></li>
                    <li class="otel-prices"><a href="#">
                        <strong>Tüm Fiyatlar</strong>
                        <span class="otel-goruntuleme">Size Özel en uygun fiyatlar</span>
                    </a></li>
                </ul>
                </div><!--otel filtre ozellikler-->
                <div class="clr"></div>
            </div><!--otel tek liste-->

            <div class="otel-filtre-tab">
                <div class="otel-tab-icerik otel-full-detay">
                    <div class="otel-degerlendirme">
                        <div class="degerlendirme-baslik">Değerlendirme</div>
                        <div class="otel-tab-detay">
                        <div class="degerlendirme-not">
                            <div class="c100 p85 green">
                              <span>85%</span>
                              <div class="slice">
                                <div class="bar"></div>
                                <div class="fill"></div>
                              </div>
                            </div><!--dairesel genel değerlendirme-->


                        </div><!-- degerlendirme not -->

                        <div class="degerlendirme-yorum">
                            <div class="yorum-bar">
                                <div class="yorum-bilgi">
                                    <p>
                                    <span class="otel-yorum-kisi">Hakan2020</span> 
                                    <span class="otel-yorum-konum">Denizli,Türkiye</span>
                                    <span class="otel-yorum-tarih">26 Eylül 2015</span>
                                    </p>
                                </div><!-- yorum bilgi -->
                                <div class="otel-yorum-profil">
                                    <img src="http://anitur.streamprovider.net/images/otel-filtre/profile.jpg" alt="" />
                                </div>
                                <div class="yorum-content">
                                    <h3><a href="#">“Özellikle, yeme içme kalitesi arayanlar için...”</a></h3>
                                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eaque provident accusantium sint tempore! Fugiat debitis maxime eos? <a href="#">Devamını oku</a></p>
                                </div>
                            </div><!-- yorum bar-->
                            <div class="yorum-bar">
                                <div class="yorum-bilgi">
                                    <p>
                                    <span class="otel-yorum-kisi">Hakan2020</span> 
                                    <span class="otel-yorum-konum">Denizsiz,Türkiye</span>
                                    <span class="otel-yorum-tarih">26 Eylül 2015</span>
                                    </p>
                                </div><!-- yorum bilgi -->
                                <div class="otel-yorum-profil">
                                    <img src="http://anitur.streamprovider.net/images/otel-filtre/profile.jpg" alt="" />
                                </div>
                                <div class="yorum-content">
                                    <h3><a href="#">“Özellikle, yeme içme kalitesi arayanlar için...”</a></h3>
                                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eaque provident accusantium sint tempore! Fugiat debitis maxime eos? <a href="#">Devamını oku</a></p>
                                </div>
                            </div><!-- yorum bar-->

                        </div><!-- degerlendirme yorum -->
                        </div>
                        <div class="clr"></div>
                    </div><!-- otel degerlendirme-->

                        <h3>Genel Değerlendirme</h3>


                        <div class="otel-genel-degerlendirme">
                            <div class="tum-degerlendirmeler">
                                <a href="#" class="tab-zero-link">Tüm Değerlendirmeler</a>
                                <h4>Tüm İzlenimler</h4>
                                <h4 class="degerlendirme">%77 Çok İyi <span>2524 yoruma göre</span></h4>
                            </div><!--tum degerlendirmeler-->
                            <div class="diger-degerlendirmeler">
                                <ul class="tab-degerlendirme">
                                    <li><a href="#" class="ciftler-bg">%35 Çiftler</a></li>
                                    <li><a href="#" class="aile-bg">%35 Aile</a></li>
                                    <li><a href="#" class="is-seyahati-bg">%35 İş Seyahati</a></li>
                                    <li><a href="#" class="yalniz-gezginler-bg">%35 Yalnız Gezginler</a></li>
                                </ul><!--tab menuler-->
                            <div class="tab-degerlendirme-icerik">
                                <div class="tab-filtre-icerik" id="ciftler">
                                    <div class="demo-show2">
                                      <h3>KAHVALTI <span class="accord-progress"></span><span class="mmn-oran">59%</span><span class="span-list">“Kahvaltı İyi”</span><span class="accord-chevron"></span></h3>
                                      <div>Deneme 1 'in içeriği</div>
                                      <h3>KAHVALTI <span class="accord-progress"></span><span class="mmn-oran">59%</span><span class="span-list">“Kahvaltı İyi”</span><span class="accord-chevron"></span></h3>
                                      <div>Deneme 2 'in içeriği</div>
                                      <h3>KAHVALTI <span class="accord-progress"></span><span class="mmn-oran">59%</span><span class="span-list">“Kahvaltı İyi”</span><span class="accord-chevron"></span></h3>
                                      <div>Deneme 3 'in içeriği</div>
                                    </div>
                                <!--<div id="progressbar-durum">
                                  <div></div>
                                </div>-->
                                </div>
                                <div class="tab-filtre-icerik" id="aile">aile..
                                    %35

                                </div>
                                <div class="tab-filtre-icerik" id="is-seyahati">iş seyahati..</div>
                                <div class="tab-filtre-icerik" id="yalniz-gezginler-bg">yalnız gezginler..</div>
                            </div><!-- tab icerik kismi-->
                            </div><!--diger degerlendirmeler-->
                        </div><!-- otel genel değerlendirme-->


                </div><!-- tab icerik-->
                <div class="otel-tab-icerik otel-fiyat-detay-icerik">otel içerik 2..</div><!-- tab icerik -->
            </div><!-- otel filtre tab -->

Answer 1

您需要使用其他选择器来获取所需的元素。首先，您需要使用.parent()或类似的选择器在dom树中爬上，然后使用.children()或.find()或其他类似的选择器在dom树中向下搜索元素。

这是你的工作范例：

$(".otel-views a").on("click",function(){
      $(this).parents('.otel-tekli-listeleme').find('.otel-full-detay').slideToggle();
      return false;
});

此处已修复codepen

jQuery这和切换问题

1 个答案: