Question

我有一个home.html和faq.html。

常见问题页面有很多问题，并且在页面下方连续列出了答案。我希望隐藏答案，直到点击一个问题打开答案。单击另一个问题时，它将关闭上一个答案并打开新答案。我想使用slideUp / slideDown或fadeIn / fadeOut，但不是必需的。
主页上有一个链接，点击后，我想进入常见问题页面并打开＆＃39;从一次点击中得出具体答案; <{1}}或slideDown再次不是必需的。

是否有可用于执行任务的JavaScript？我已经看到一些fadeIn类型代码的帖子在faq页面上可以接受，但不是我可以从我的主页激活。我是新手，所以我也要求html代码，我可以在两个页面上插入。我知道比平时更大的苦差事！非常感谢。

请注意由于以下原因，我现在看到了我的想法有问题。我以前没有提过，但这是必要的。让我试着解释一下。我现在发现，在一个页面上有一个链接，在该页面的特定位置打开另一个页面如果未隐藏该页面上的先前内容，则将页面正确定位到该点。如果之前的内容为setvisibility，则该页面将打开的那一点是无效的。换句话说，它在预期的下方打开，如果之前的内容未被隐藏，则该点是正确的。我希望这是有道理的。在我查看原始问题之前，我会很快看看visibility: hidden;是否更适合这种情况。感谢那些帮助我约会的人，你花了很多时间陪我。

Answer 1

您可以将querystring参数添加到faq页面的请求中，并在faq页面上使用javascript读取查询字符串。根据您传递的参数，您可以制作所需的动画。

在 home.html 中：您可以使用查询字符串参数创建链接，如下所示：

<a href="http://example.com/faq.html?question=125">Link to FAQ</a>

在 faq.html 中：您需要阅读querystring参数，并根据值调用实际处理问题显示/隐藏的javascript函数。

要在javascript中读取查询字符串参数，您需要解析window.location.search。这是一个可以使用的javascript助手：

var QueryString = function () {
  // This function is anonymous, is executed immediately and 
  // the return value is assigned to QueryString!
  var query_string = {};
  var query = window.location.search.substring(1);
  var vars = query.split("&");
  for (var i=0;i<vars.length;i++) {
    var pair = vars[i].split("=");
        // If first entry with this name
    if (typeof query_string[pair[0]] === "undefined") {
      query_string[pair[0]] = pair[1];
        // If second entry with this name
    } else if (typeof query_string[pair[0]] === "string") {
      var arr = [ query_string[pair[0]], pair[1] ];
      query_string[pair[0]] = arr;
        // If third or later entry with this name
    } else {
      query_string[pair[0]].push(pair[1]);
    }
  } 
    return query_string;
} ();

然后，您可以访问QueryString.question

Answer 2

试试这个

Reference

$(function() {
    $('div.answer').hide();        
    $('a.question').before('<span class="faqplusminus dark nounderline">[+]</span>');
    $('a.question').click(function() {
        $('div.answer').slideUp('slow', 'easeInOutExpo');            
        $('span.faqplusminus').html('[+]');    
        var slidedownelement = $(this).closest('div.faq').find('div.answer').eq(0);    
        if(!slidedownelement.is(':visible')) {
                slidedownelement.slideDown('slow', 'easeInOutExpo');
            slidedownelement.parent().find('span.faqplusminus').html('[-]');    
        }
    });
});

一个页面上的JavaScript按钮链接，以在另一个页面上显示隐藏的div

2 个答案: