链接点击仅工作一次

时间:2016-09-09 11:02:44

标签: javascript jquery

我有隐藏的div,里面包含一个div,默认情况下这个div是隐藏的,我有链接应该带来(#mobiles_thumbs)div的内容,每个东西都完美地工作只是为了第一次点击链接和第二个单击更改其内容的div消失我使用(on)委托。这是我的代码:



//and here my jquery code for handle the link click : 

$('#products').on('click', 'a', function() {

  $("#thumbs").html($("#thumbs_collection #mobiles_thumbs"));
  /* here #thumbs_collection is the name of big div that contain six 
  div inside it.
  */
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- this is the hidden div -->
<div id="thumbs_collection">
  <div id="mobiles_thumbs" style="visibility:hidden">
    <img alt="mobile1" src="images/mobile1.jpg">
    <img alt="mobile2" src="images/mobile2.jpg">
  </div>
</div>

<div id="products" class="container-fluid">
  <div class="row">
    <div class="col-md-8 col-md-offset-2">
      <h1>Our Products </h1>
    </div>
    <div class="col-sm-12">
      <ul>
        <li> <a href="#mobiles"> Mobiles </a></li>
        <li> <a href="#swatches"> Swatches </a></li>
        <li> <a href="#chairs"> Chairs </a></li>
        <li> <a href="#boxs">Boxs </a></li>
        <li> <a href="#Doors"> Doors </a></li>
        <li> <a href="#windows"> Windows </a></li>
      </ul>
    </div>
    <div id="thumbs">
      <!--this div for load the products -->
    </div>
  </div>
</div>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:2)

尝试克隆元素拳头,不要忘记在html追加后切换可见性

@Component({
   providers: [Service1, Service2]
})