如何使用获得的单选按钮值从第一页到第二页的localStorage / AJAX的jQuery [英] How to get radio button value from first page to second page using localstorage / ajax jquery
问题描述
目前正在本地存储，其中在第一页，我有两个单选按钮，如果用户在第二页面板中选择一个单选按钮具有隐藏。如果从第二页验证用户选择单选按钮，一个文本字段是不应该的，我不知道如何使用localStorage的或AJAX哪一个是最好的
当我看到，所以我得到的东西 window.localStorage.setItem（KEY_NAME，stringValue的）;
请指导我如何使用这样的：
第一页code
＆LT;！DOCTYPE HTML＆GT;
＆LT; HTML＆GT;
＆LT; HEAD＆GT;
＆LT;脚本SRC =HTTPS：//$c$c.jquery.com/jquery-1.11.3.js＆GT;＆LT; / SCRIPT＆GT;
＆LT;元字符集=utf-8＆GT;
＆LT;标题＆gt;首先网页＆LT; /标题＆GT;
＆LT; /头＆GT;
＆LT;身体GT;
＆LT;形式ID =first_pge级=first_pge行动=second.page＆GT;
＆LT;输入类型=无线电名称=无线电ID =first_radio/＆GT;
＆LT;输入类型=无线电名称=无线电ID =second_radio/＆GT;
＆LT;输入类型=按钮值=提交ID =btn_sub/＆GT;
＆LT; /表
＆LT; /身体GT;
＆LT; / HTML＆GT;
第二页
＆LT;！DOCTYPE HTML＆GT;
＆LT; HTML＆GT;
＆LT; HEAD＆GT;
＆LT;脚本SRC =HTTPS：//$c$c.jquery.com/jquery-1.11.3.js＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.14.0/jquery.validate.min.js"></script>
＆LT;脚本src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.14.0/additional-methods.min.js"></script>
＆LT;脚本＆GT;
jQuery.validator.setDefaults（{
调试：真实，
成功：有效的
}）;
$（＃MyForm的）。验证（{
规则：{
领域： {
要求：真实的
}
}
}）;
＆LT; / SCRIPT＆GT;
＆LT;元字符集=utf-8＆GT;
＆LT;冠军＆GT; JS斌＆LT; /标题＆GT;
＆LT;风格＆GT;
.div_panel {
背景色：黄色;
字体大小：16像素;
}
＆LT; /风格＆GT;
＆LT; /头＆GT;
＆LT;身体GT;
＆LT;形式ID =MyForm的类=MyForm的＆GT;
＆LT; DIV CLASS =div_panel＆gt;首先＆LT; / DIV＆GT;
＆LT; DIV＆GT;＆安培; NBSP＆LT; / DIV＆GT;
＆LT;输入类型=文本ID =现场级=字段/＆GT;
＆LT;输入类型所需=按钮值=提交ID =btn_sub1/＆GT;
＆LT; /形式GT;
＆LT; /身体GT;
＆LT; / HTML＆GT;
目前使用jQuery按以下用户的帮助了我。
在第一页，我的设置是这样
storeData（）;
功能storeData（）
{
警报（检查）;
localStorage.setItem（PG，$（'＃basicForm #pg）ATTR（'检查'，'检查'））;
//警报（是+ GETD）;
localStorage.setItem（'铜'，$（'＃basicForm #cu）ATTR（'检查'，'检查'））;
}
当我默认设置此，在第二页的特别股利躲在如果用户打开第二个直接页：（
请，请帮助我。
如果（localStorage.getItem（PG））
{
$（'＃edu_info）隐藏（）。
}
看看的的 HTML5本地存储 ，它真的好用。
我认为你必须添加的onsubmit（）在你想在的localStorage 和表单和储存的值第二个页面，您可以用得到它们 localstorage.getItem（）。
添加在表单中的的onsubmit 事件，将调用调用的函数 storeData（）这将增加您的电台按键值的的localStorage ：
＆LT;形式ID =first_pge级=first_pge行动=second.page的onsubmit =storeData（）＆GT;
添加功能 storeData（）：
＆LT;脚本＆GT;
功能storeData（）
{
localStorage.setItem（first_radio'，$（'＃first_pge #first_radio）是（：选中'））;
localStorage.setItem（second_radio'，$（'＃first_pge #second_radio）是（：选中'））;
}
＆LT; / SCRIPT＆GT;
现在你有两个电台的价值，你可以用它们用在第二页的getItem（）：
如果（localStorage.getItem（'first_radio'））
{
$（'。div_panel）隐藏（）。
}
喜欢这一点，如果在第一页第一radion检查板将被隐藏。
Currently working on local storage where In the first page I have two radio buttons if user select first radio button in the second page panel has to hide. And if user select radio button one text field from second page validation should not happen I have no idea how to use localStorage or ajax which one will be the best
When i saw SO i got something window.localStorage.setItem("key_name", "stringValue");
Kindly guide me how to use this :
First page code
<!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>
Second page
<!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> </div>
<input type="text" id="field" class="field" />
<input type="button" required value="Submit" id="btn_sub1" />
</form>
</body>
</html>
Currently working with jquery as per the below user helped me.
in the first page I am setting like this
storeData();
function storeData()
{
alert("check");
localStorage.setItem('pg', $('#basicForm #pg').attr('checked', 'checked'));
//alert("yes" + getd);
localStorage.setItem('cu', $('#basicForm #cu').attr('checked', 'checked'));
}
when I am setting this in the second page by default the particular div was hiding if the user open second page directly :(
Kindly please help me
if( localStorage.getItem('pg') )
{
$('#edu_info').hide();
}
Take a look at HTML5 Local Storage, it's realy easy to use.
I think you have to add onsubmit() in your form and store values you want in localstorage and in the second page you can get them using localstorage.getItem().
Add in your form the onSubmit event that will call the function called storeData() that will add your radio buttons values to the localstorage:
<form id="first_pge" class="first_pge" action="second.page" onsubmit="storeData()">
Add function 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>
Now you have the value of the both radios and you can use them in second page using getItem() :
if( localStorage.getItem('first_radio') )
{
$('.div_panel').hide();
}
Like this if the first radion in first page is checked the panel will be hidden.
这篇关于如何使用获得的单选按钮值从第一页到第二页的localStorage / AJAX的jQuery的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
