Question

我正在尝试实现此处所述的平滑滚动效果jquery smooth scroll to an anchor? 使用Godaddy的网站建设工具。不幸的是，该工具增加了许多自己的样板代码，我自己的标记最终在其中。因此，似乎永远不会调用jquery脚本，而不是平滑的滚动效果，我有通常的＆＃34;跳跃＆＃34;到目标部分。

工具生成的标记如下，其中添加了外部div元素并且＆＃34;包装＆＃34;我自己的标记（锚元素）：

<div class="wsb-htmlsnippet-element"><a class="scroll" href="#things">Supported Things</a></div>

以类似的方式，目标元素id也包含在div中：

<div class="wsb-htmlsnippet-element"><section id="things"><h2>Supported Things</h2></section></div>

我应该如何修改原始脚本，无论网站构建工具用于包装我自己的自定义标记的额外div（或其他元素）是什么，它都会在下面复制？

$(".scroll").click(function(event){
   event.preventDefault();
   //calculate destination place
     var dest=0;
     if($(this.hash).offset().top > $(document).height()-$(window).height()){
          dest=$(document).height()-$(window).height();
     }else{
          dest=$(this.hash).offset().top;
     }
     //go to destination
     $('html,body').animate({scrollTop:dest}, 1000,'swing');
 });

Answer 1

在div中选择一个类元素：

$("div.wsb-htmlsnippet-element").find(".someclass").click(function(event){
 . 
 .
 . 
});

Answer 2

据我所知，无论有多少元素环绕你的锚，你的脚本都已经有效了。

编辑：感谢downvote，我是正确的：https://jsfiddle.net/wfvjus0h/

<div class="whatever"><div class="ok">
<div class="wsb-htmlsnippet-element"><a class="scroll" href="#things">Supported Things</a></div>
    </div></div>

<div class="longdiv">aeaeaeae</div>

<div class="wrapper1""><div class="wrapper2"><div id="things">Things</div></div></div>

如何在jquery中选择div中的class元素

2 个答案: