Question

我重复以下代码。

<div class="background1"></div>

 <i class="fa fa-share" alt="share"  title="Share"></i>
 <div class="large1">
      <div class="ttip">
          <div>Here goes contents...</div>
              <span class="note">(click here to close the box)</span>
      </div>
 </div>

我想显示类big1和背景的div。这是code（不是我的。在网上发现它）重复。

我尝试在java-script

中执行以下操作

$('.fa-share').click(function (){
                    $(this).next(".large1").first().html(function() {
                                $(this).prev(".background1").css({"opacity": "0.3"}).fadeIn("slow");
                                $(this).next('.ttip').css({left: $(this).position() + '20px',top: $(this).position() + '50px'}).show(500)
                    }).fadeIn("slow");

                    $(this).next('.note').on('click', function() {
                        $(this).prev('.ttip').hide(500);
                        $(this).prev(".background1").fadeOut("slow");
                        $(this).prev(".large1").fadeOut("slow");
                    });
                });

我曾尝试在第一次点击时使用“.each（）”但是没有用。提前致谢。

Answer 1

NVM 我搞定了。谢谢你们所有人。

$('.fa-share').click(function (){
                        $(this).prev(".background1").css({"opacity": "0.3"}).fadeIn("slow");
                        $(this).next(".large1").html(function() {$('.ttip').css({left: $(this).position() + '20px',top: $(this).position() + '50px'}).show(500)
                        }).fadeIn("slow");
                    });
                $('.note').on('click', function() {
                    $(this).closest('.ttip').hide(500);
                    $$(this).closest(".large1").prev(".fa-share").prev(".background1").fadeOut("slow");
                    $(this).closest(".large1").fadeOut("slow");
                });

Answer 2

它可以帮到你：

    $(document).ready(function () {
        $('.fa-share').on('click', 'a.note', function (event) {
            event.stopPropagation();
            event.preventDefault();
            $('.large1').fadeIn();
            $('.background1').fadeIn();
        });

        $('.large1').on('click', 'span.note', function () {
            $(this).closest('.large1').fadeOut();
            $('.background1').fadeOut();
        });
    });

<div class="background1" style="display:none;">
    <p>here's some text</p>
</div>

<i class="fa fa-share" alt="share" title="Share">
    <a href="#" class="note">click to show large1 and background1</a>
</i>
<div class="large1" style="display:none;">
    <div class="ttip">
        <div>Here goes contents...</div>
        <span class="note">(click here to close the box)</span>
    </div>
</div>

P.S 我认为你没有关于jquery和javascript的任何基础知识。我建议你看一下这个页面： https://www.codeschool.com/courses/try-jquery并学习本课程。它将为您提供有关js / jquery基本级别的大量知识。（如果上层链接无法在google上搜索：codeschool tryjquery课程免费基础级别1）

div的jquery循环

2 个答案: