通过单击没有父标记来隐藏任何元素(当我粘贴JQuery代码并单击它应该隐藏的元素时)

时间:2016-08-18 09:34:08

标签: javascript jquery

如果我点击该事件,该元素应隐藏在网站的任何位置。如果我通过点击元素将此代码粘贴到任何网站中,则应隐藏<div>代码<p>标记更多内容 条件它不依赖于元素的父元素。

示例:

jQuery(document).ready(function () {
$(this).click(function( ){
        $(this).hide();
    });
}); 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
 <section id='app-demo'>
          <div class="everything-but-toolbar">
            <div class="animation-element-panel"></div>
            <div class="headlines">
                <h2>Mockingbird</h2>
                <h3>s

                </h3>
                <h3>

                </h3>
                <span class="animation-cursor non-animating"></span>
                <a class="try-it" href=/try><span class="arrow">Try creating wireframes for free<span></a>
            </div>

            <div class="animation-pointer"></div>
            <div class="animation-grabby-hand-open"></div>
            <div class="animation-grabby-hand-grabbing"></div>
            <div class="animation-welcome-text">
              <span>Welcome</span>
            </div>
          </div>
          <div class="animation-toolbar">
            <div></div>
          </div>
    </section>
    <section id='tagline'>
      <h1>
        Mock up an application and show what's important:
      </h1>
      <p>
        <span>the idea</span>, <span>the information</span>, <span>the interaction.</span>
      </p>
    </section>
    <section id='features'>
      <div>
        <img class="circle-1" alt="Create mockups with drag and drop" src="/static/images/homepage-circle-1.png"></img>
        <h2>Mock up your idea fast</h2>
        <p>
          Drag and drop UI elements to the page, then rearrange and resize. Go from idea to mockup in minutes.
        </p>
      </div>
      <div>
        <img class="circle-2" alt="Add multiple pages to your mockup" src="/static/images/homepage-circle-2.png"></img>
        <h2>Link and click between pages</h2>
        <p>
          Link multiple mockups together and preview them interactively to get a feel for the flow of your application.
        </p>
      </div>
      <div>
        <img class="circle-3" alt="Share your mockup with collaborators" src="/static/images/homepage-circle-3.png"></img>
        <h2>Collaborate live</h2>
        <p>
          Share a link, and clients and teammates can edit wireframes with you in real time. No more emailing images back and forth.
        </p>
      </div>
    </section>



<footer>
    <div id='try-it'>

            <a class='try-it' href="/try">Try it for free</a> or
            <a class='log-in' href=/login>log in</a>

    </div>

    <nav>
        <a href="/pricing" ><span>Pricing</span></a>
        <a href="/privacy" ><span>Privacy</span></a>
        <a href="/terms" ><span>Terms</span></a>
        <a href="/help" ><span>Help</span></a>

    </nav>

如果我点击页面中的任何位置,则应隐藏特定元素。

我尝试使用它,但它没有用。

1 个答案:

答案 0 :(得分:0)

此处$(this)表示window您点击window并尝试隐藏window。您需要点击body中的元素并隐藏它们。

$(function () {
  $("body").children().click(function () {
     $(this).hide();
   });
});