如何使用 localstorage / ajax jquery 获取从第一页到第二页的单选按钮值

2024-02-16

目前正在处理本地存储,在第一页中,如果用户选择第二页面板中的第一个单选按钮,则必须隐藏两个单选按钮。如果用户选择单选按钮,则第二页验证中的一个文本字段不应发生。我不知道如何使用 localStorage 或 ajax 哪一个是最好的。

当我看到SO时我得到了一些东西window.localStorage.setItem("key_name", "stringValue");

我该如何使用这个?

第一页代码

<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
  <meta charset="utf-8">
  <title>First page</title>
</head>
<body>
 <form id="first_pge" class="first_pge" action="second.page">
<input type="radio" name="radio" id="first_radio"/>
  <input type="radio" name="radio" id="second_radio"/>
  <input type="button" value="submit" id="btn_sub"/>
  </form
</body>
</html>

第二页

<!DOCTYPE html>
<html>

 <head>
    <script src="https://code.jquery.com/jquery-1.11.3.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.14.0/jquery.validate.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.14.0/additional-methods.min.js"></script>
    <script>
            jQuery.validator.setDefaults({
                    debug: true,
                    success: "valid"
            });
            $("#myform").validate({
                    rules: {
                            field: {
                                    required: true
                            }
                    }
            });
    </script>
    <meta charset="utf-8">
    <title>JS Bin</title>
    <style>
            .div_panel {
                    background-color: yellow;
                    font-size: 16px;
            }
    </style>
 </head>
 <body>
    <form id="myform" class="myform">
            <div class="div_panel">First</div>
            <div>&nbsp</div>
            <input type="text" id="field" class="field" />
            <input type="button" required value="Submit" id="btn_sub1" />
    </form>
   </body>
 </html>

目前按照以下用户使用 jQuery 帮助了我。

在第一页我是这样设置的

            storeData();
        function storeData()
            {
                alert("check");
                localStorage.setItem('pg', $('#basicForm #pg').attr('checked', 'checked'));
                //alert("yes" + getd);
                localStorage.setItem('cu', $('#basicForm #cu').attr('checked', 'checked'));
            }

当我默认在第二页中设置此选项时,如果用户直接打开第二页,则特定的 div 会隐藏。

if( localStorage.getItem('pg') )
{
    $('#edu_info').hide();
}

看一眼HTML5 本地存储 http://www.w3schools.com/html/html5_webstorage.asp,它真的很容易使用。

我认为你必须添加onsubmit()在您的表单中并存储您想要的值localstorage在第二页中你可以使用它们localstorage.getItem().

在您的表单中添加onSubmit将调用函数的事件storeData()这会将您的单选按钮值添加到localstorage:

<form id="first_pge" class="first_pge" action="second.page" onsubmit="storeData()">

添加功能storeData() :

<script>
    function storeData()
    {
        localStorage.setItem('first_radio', $('#first_pge #first_radio').is(':checked'));
        localStorage.setItem('second_radio', $('#first_pge #second_radio').is(':checked'));
    }
</script>

现在您已经有了两个无线电的值,您可以在第二页中使用它们getItem() :

if( localStorage.getItem('first_radio') )
{
    $('.div_panel').hide();
}

像这样,如果选中第一页中的第一个单选按钮,面板将被隐藏。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使用 localstorage / ajax jquery 获取从第一页到第二页的单选按钮值 的相关文章

随机推荐

  • 如何通过表单外的按钮提交表单?

    我想通过表单外部的按钮提交表单并对该表单进行验证 我正在使用react bootstrap 中的Form 标签 我的代码不验证表单
  • 类(静态)变量和方法

    我如何创建课程 即static https en wikipedia org wiki Method computer programming Static methods Python 中的变量或方法 在类定义内部但不在方法内部声明的变量
  • 使用 Boto 返回 CloudFormation 模板的输出?

    我正在尝试使用 Boto 从 CloudFormation 模板检索输出列表 我在文档中看到有一个名为boto cloudformation stack Output 但我认为这是未实现的功能 目前这可能吗 如果你做一个describe s
  • 如何在 iPython 笔记本中设置默认启动命令?

    我想在我创建的每个新笔记本中的几乎每个新笔记本中放置几个 带有我需要的命令的单元格 例如 当我创建一个新笔记本时 它应该放置一个 matplotlib inline import matplotlib pyplot as plt 默认在单元
  • 如何将变量值从 javascript 传递到 perl

    我正在使用 JavaScript 插件来获取 IP 地址 如果 IP 地址开头为10 15我想为一个变量分配一个值 如果IP以10 13我想为同一个变量分配不同的值 我不知道该变量是否必须在 Perl 或 JavaScript 中 我正在尝
  • Sencha Touch - Google 地图并将标记居中

    是我一个人的问题还是谷歌地图 API 似乎有点奇怪 尝试简单地显示某些坐标的标记 然后将屏幕置于标记的中心 在我的控制器中从视图触发 onGoogleMapRender function googleMap var long record
  • 无法使用 Osmdroid 实现 onTouchEvent(拖放)

    我一直在尝试实现 OnTouchEvent 以便当用户移动 拖放 覆盖项时我可以做出反应 我在 Osmdroid 网站上发现了类似的内容 http code google com p osmdroid issues detail id 22
  • OnClickListener 仅在第二次监听

    我有一个 editText 并向其中添加了一个 onClickListener 在单击方法中 我只是清除文本 当我第一次单击 editText 时 键盘会弹出 但它不会进入 onClick 方法 当我第二次单击它时 它被调用并清除文本 qt
  • 如何在 bash 脚本中执行命令,然后聚焦出现的窗口

    我有一个像这样的 bash 脚本 bin sh firefox Firefox 窗口打开 但没有焦点 我该怎么做才能让它自动获得焦点 我可以使用一些 X 窗口工具 命令 但如何获取 Firefox 的窗口 ID 窗口名称随着显示的 URL
  • 如何使带有列表数据源的tttableview顶部的蓝色条消失(在ios 5 beta上运行的程序)

    当程序在 ios 5 beta 上运行时 我的 tttableview 顶部会出现一个蓝色条 如果我在 ios 4 3 上运行程序 则不会出现蓝色条 该表配置为使用列表数据源 有谁知道是什么问题 ios 5 的 tableview api
  • Ajax 调用下载从 RESTful 服务返回的文件

    我对 AJAX 相当陌生 我正在使用 AJAX 向服务器发送请求 该服务返回一个文本文件 但返回数据时没有出现下载框 返回文件的rest服务如下 Path examples public class ExampleCodesRest POS
  • 在 Shiny 中下载 RenderTable() 数据帧上的处理程序

    我有一个闪亮的应用程序 它采用如下所示的 csv 文件 category action 并将其输入到数据框中以仅使用 action 过滤类别 可复制的应用程序 UI library shiny shinyUI fluidPage title
  • 再次为该片段创建 ViewModel

    我在 MainFragment 中创建视图模型 Override public void onActivityCreated Nullable Bundle savedInstanceState super onActivityCreate
  • Javafx 2 图表通过手绘调整大小

    我有一个在 JavaFX 2 0 中徒手绘制 XYChart 的代码 调整图表大小时遇到 问题 当我调整大小时 我遇到了徒手绘制的翻译问题 当我调整大小时 新绘图最初看起来超出了比例 但经过一点 图表移动 后 绘图它会自行修复 我该如何改进
  • 带取消功能的VBA密码输入

    我一直在使用 Daniel Klann 编写的标准密码文本框 http www ozgrid com forum showthread php t 72794 http www ozgrid com forum showthread php
  • 重命名包名称后出现“找不到符号 R”错误

    重命名我的项目包名称 使用重构 后 我收到此错误 Error 7 44 error cannot find symbol class R 我的全部R用法无效 我尝试手动修复它 但它对我不起作用 Invalidate chases Resta
  • Next.js 中未定义 localstorage

    我正在尝试将应用程序从 React 移至 Next 在 React 中我没有收到此代码的错误 let authTokens setAuthTokens useState gt localStorage getItem authTokens
  • MongoDB TTL过期检查的更改周期

    关于基于TTL索引的文档过期MongoDB 文档 https docs mongodb com manual core index ttl timing of the delete operation says 删除过期文档的后台任务每 6
  • 选项卡切换事件可用于 Google Chrome 扩展吗?

    作为 Google Chrome 扩展 是否可以监听选项卡切换 也就是说 在标签切换刚刚发生时收到通知 I want to make an extension that in fullscreen when switching tabs w
  • 如何使用 localstorage / ajax jquery 获取从第一页到第二页的单选按钮值

    目前正在处理本地存储 在第一页中 如果用户选择第二页面板中的第一个单选按钮 则必须隐藏两个单选按钮 如果用户选择单选按钮 则第二页验证中的一个文本字段不应发生 我不知道如何使用 localStorage 或 ajax 哪一个是最好的 当我看