jquery发送到新网页+传递变量

jquery send to new web page + pass variable

本文关键字：变量 网页 新网页 jquery      更新时间：2023-09-26

在我的网站的"about"页面上，单击"Next"按钮将浏览几张幻灯片。这是使用一个名为"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吗？

我不知道该怎么办…非常感谢你的帮助！

如果您在页面上显示幻灯片，只需跟踪变量即可。如果你不是，那么以下是几种方法：

  • 传递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>

我可以给重定向传递一个值"count"吗？

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

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

在JavaScript中，你可以做这样的事情：

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

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

当然，您随后如何在下一页使用该值完全是另一回事。如果所有内容都是客户端代码（我认为.html扩展在某种程度上暗示了这一点），那么您应该在JavaScript中使用查询字符串值。

传入变量计数：

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

您可以通过以下方式获取通过计数的数字：如何在JavaScript中获取查询字符串值？

然后，让jQuery进入相应的幻灯片。

相关文章：