1

在我网站的“关于”页面上,单击“下一步”按钮将浏览几张幻灯片。这是使用名为“count”的变量和 jquery 完成的:

$("#NextBtn").click(function() {
  count = count + 1
});

$("#NextBtn").click(function(){

/*on count=0, the background image is shown*/

if (count==1) {
  $('#slides').slideToggle();
};


if (count==2) {
  $("#slide_1").hide()
$("#slide_2").show()

};

if (count==3) {
  $("#slide_2").hide()
$("#slide_3").show()

};

点击我主页上的链接(./*home.html),我想将用户发送到这个“关于”页面,显示幻灯片编号 2。

<a href="./*about.html">Click here</a>

我怎样才能做到这一点?我可以将重定向传递一个“count”值吗?我可以告诉 jquery,如果用户来自主页,显示幻灯片 2?

我不知道该怎么做...非常感谢您的帮助!

4

3 回答 3

2

如果您在页面上显示幻灯片,您可以简单地跟踪变量。如果你不是,那么这些是几种方法:

  • 传递GET数据。看到这个答案。更改 url(适合发送链接,不适合短 url),在服务器上也可见
  • 传递POST数据。如果您不能更改服务器(否则不是一个很好的服务器),这不是一个真正的选择,但不会更改 url。
  • 设置一个cookie。如果有多个选项卡/窗口,可能会出现奇怪的行为。
  • 添加#位置。我认为这是最合适的,如果您还没有将 # 用于其他用途。不会干扰表单获取数据,但允许用户将带有正确幻灯片的 url 发送给朋友。看到这个

TL;DR:将幻灯片编号添加到重定向 url#之前,然后使用window.location.hash它在下一页上检索它。

编辑:这是工作示例代码

<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>
        <script type="text/javascript">
            var def = '#slide1';

            function slide_jump(goal)
            {
                if (goal[0] == '#')
                {
                    goal = goal.substring(1)
                }
                $('[name^="slide"]').hide();
                if (goal)
                {
                    $('[name=' + goal + ']').show();
                }
                else
                {
                    window.location.replace(def);
                    $('[name=#' + goal + ']').show();
                }
            }

            $(document).ready(function()
            {
                slide_jump(document.location.hash);
                $('#nav a').each(function(k, elem)
                {
                    $(elem).click(function (elem, event)
                    {
                        slide_jump($(elem).attr('href'));

                    }.bind(null, elem));
                });
            });
        </script>
    </head>
    <body>
        <div id="nav">
            <a href="#slide1">First</a>
            <a href="#slide2">Second</a>
        </div>
        <div name="slide1">
            Hello and welcome on slide 1!
        </div>
        <div name="slide2">
            So we are on slide 2, then?
        </div>
    </body>
</html>
于 2013-06-24T18:09:03.143 回答
0

我可以将重定向传递一个“count”值吗?

当然,它只需要一点代码。您可以使用要传递到下一页的数据附加查询字符串值。但由于该值是动态的,因此您需要在 JavaScript 中处理对链接的实际点击。所以链接本身可能是这样的:

<a href="#" id="aboutLink">Click here</a>

在 JavaScript 中你会做这样的事情:

$('#aboutLink').click(function () {
    window.location = 'about.html?count=' + count;
});

当然,这假设该count值当时在范围内。如果不是,您必须找到一种使其可用的方法,例如将其移动到更高的范围,或者可能编写另一个函数来确定当前计数并返回它。

当然,您随后如何在下一页使用该值完全是另一回事。如果一切都是客户端代码(.html我认为这在扩展中有所暗示),那么您会希望在 JavaScript 中使用查询字符串值

于 2013-06-24T17:57:52.057 回答
0

传入变量计数:

<a href="./*about.html?count=2">Click here</a>

您可以通过以下方式获取传递给计数的数字:如何在 JavaScript 中获取查询字符串值?

然后,让您的 jQuery 前进到相应的幻灯片。

于 2013-06-24T17:59:22.960 回答