Question

我有一些常见问题解答只会在用户点击问题时显示答案。如此基本的切换显示和隐藏。

我希望页面顶部有一些锚链接，不仅可以链接到正确的问题，还可以显示答案。

这是codepen - 正如您点击顶部的链接时所看到的，它会链接到问题，但不会显示答案。当点击页面顶部的链接时，我想要display: block的答案。

所以要确认：

点击页面顶部的链接
滚动至问题（对应的h5标签）
直接在相应的h5标签下打开p标签。

想知道最好的方法。我尝试在顶部的一个类中给出链接，然后在单击时获取href属性，但似乎无法使其正常工作。

HTML：

<a href="#faq1">What does this include?</a>
<h5 id="faq1">What does landlord insurance cover me for?</h5>
<p>The standard perils landlord insurance covers you for are the same as standard home insurance. They are things like fire, floods, escape of water, subsidence etc.  The differences can be things like loss of keys, loss of rent, conditions on leaving it unoccupied etc.  Our online quote system or advisor will be able to discuss your requirements and find something that suits your needs exactly. </p>

jQuery的：

$(".newfaqs h5").next().hide();
$(".newfaqs h5").click(function() {
    $(this).toggleClass('expanded');
    $(this).next().slideToggle();
});

Answer 1

使用此：

// source array
var arr = [0, 0, 4, 8, 8, 10, 45, 0, 23, 3, 8];
// temporary variable for distribution
var oTemp = {};
// your result array
var aResult = [];
// make distribution
arr.forEach(function (i) {
    //test if item exist, if so add one, otherwise assign 1
    oTemp[i] = oTemp[i] + 1 || 1;
});
// make result array
Object.keys(oTemp).forEach(function (i) {
    // according to requirement, only more than one count is used
    if (oTemp[i] > 1) {
        // push a new array, which is filled with the count to the result
        aResult.push(Array.apply(null, { length: oTemp[i] }).map(function () { return i; }));
    }
});

http://codepen.io/anon/pen/MwWVVE

Answer 2

试试这个。

start_KEMT(**button**)

$(".newfaqs h5").next().hide();
$(".newfaqs h5").click(function () {
  $(this).toggleClass('expanded');
  $(this).next().slideToggle();
});

$(".link-questions").click(function(){
  
  var question=$($(this).attr('href'));
  question.next('p').slideDown();
  
});

Answer 3

在脚本中添加以下内容。

 $("a").click(function () {
 $('[id="'+$(this).attr('href').replace("#","")+'"]').next().slideDown();
});

参考jsfiddle http://jsfiddle.net/5gebq82q/1/

使用锚点链接到部分并显示下一个元素

3 个答案: