单击按钮后链接不起作用

问题描述 投票:0回答:1

我在div“integel1”中使用了一个内容按钮开关。联系人链接(javascript)id =“link”class =“link2”,但是在我点击按钮“knop3”之后无效。它需要向下或向上滚动,但在我点击按钮之后它就不起作用了。有人知道这是为什么吗?

//This is the function when clicking the link:

$(function() {
  "use strict";
  $('.link2').on('click', function() {
    $('html,body').animate({
      scrollTop: $(".footer").offset().top * 0.976
    }, 850);
  });
});
//And this is the code for switching between different content:
$('#knop3').on('click', function() {
  if ($('#5').css('display') != 'none') {
    $('#6').html($('#static2').html()).show().siblings('div').hide();

  } else if ($('#6').css('display') != 'none') {
    $('#5').show().siblings('div').hide();

  }
});

$('#knop3').click(function() {
  var $this = $(this);
  $this.toggleClass('SeeMore2');
  if ($this.hasClass('SeeMore2')) {
    $this.text('Minder info!');
  } else {
    $this.text('Meer info!');
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="integel1">
  <button id="knop3">Meer info!</button>
  <div id="5" style="border: none; outline: none;">
    <p id="titelchange" style="text-align: center;">CMS Website</p>

    <p class="prijsinfo"> &#10004; &emsp;Uniek ontwerp responsive. </p>
    <p class="prijsinfo"> &#10004; &emsp;Inclusief (wordpress) CMS. </p>
    <p class="prijsinfo"> &#10004; &emsp;Te bereiken voor alle vragen <a id="link" class="link2" href="javascript:;">contact</a>.</p>
    <p class="prijsinfo"> &#10004; &emsp;Vele plugin's kunnen geïnstalleerd worden.</p>

    <p style="margin-top:5vmax;" class="prijs">
      *Prijs vanaf 179,99 euro,-</p>


  </div>

  <div id="6" style="display: none; outline: none; border: none;"></div>

  <div id="static2" style="display: none;">

    <p class="prijsinfo">Een <b>CMS website</b> staat voor Content Management System: u kunt zelf makkelijk vanaf thuis de inhoud van uw website veranderen. Dit word ook gemaakt met een unieke vormgeving en helemaal responsive voor mobiel en tablet. Het is door het systeem
      makkelijk om pagina's aan te maken, maar ook tekst, foto's en filmpjes. Het is daarom handig om voor dit pakket te kiezen als u zelf veel inhoud wilt aanpassen.<br>
      <br> Wees niet gevreesd over de complexiteit, het werkt ongeveer alsof u in een tekstverwerker werkt. Het is heel eenvoudig en als u vragen heeft kunt u altijd <a id="link" class="link2" href="javascript:;">contact</a> met ons opnemen.
      <br>


      <br>
    </p>


    <p class="prijs">*Prijs CMS website vanaf 179,99 euro,-</p>

  </div>
</div>
<div class='footer'></div>

感谢帮助

javascript html
1个回答
0
投票

它不起作用,因为,你错过了页脚。

 ...

</div>
</div>
<div class='footer'></div>

你错过了一个类link2的html元素。不确定您是否打算使用id,或者将类放在按钮上。但是我用一个有效的例子为你做了一个jsfiddle

<button class="link2" id="knop3">Meer info!</button>

把它放在最后,或者你想要你的页脚。

© www.soinside.com 2019 - 2024. All rights reserved.