如何在JavaScript中将值从一个html页面传递到另一个页面? [英] How to pass value from one html page to another in JavaScript?

查看:106
本文介绍了如何在JavaScript中将值从一个html页面传递到另一个页面?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我知道这个问题问了很多次,但我的问题是不同的。

我有3个html页面,比如 apply.html personal_info.html resume info.html


  1. 在apply.html页面中: -

    我使用一个LinkedIn按钮进行LinkedIn登录。当用户点击该按钮并填写登录信息时,它会从LinkedIn获取用户数据。并在同一页面上显示(apply.html)。 c $ c>我们从LinkdIn中获取。

  2. 在Resume_info.html中: -

    在这里,我需要展示我们在LinkedIn上使用apply.html页面获取的职业信息。

我不明白如何做到这一点?我对 Html,JavaScript 非常新。

这里是我的代码供您参考。


Apply.html我在哪里获取LinkedIn日期

 < html> ; 
< head>
< script type =text / javascript>
函数loadData(){
IN.API.Profile(me)
.fields([id,firstName,lastName,pictureUrl,headline ,行业,位置:(名称),职位:(标题),emailAddress])
.result(function(result){$ b $ profile = result.values [0] ;
profHTML =< p>< a href = \+ profile.publicProfileUrl +\>;
profHTML + =< img class = img_border align = \left \src = \+ profile.pictureUrl +\>< / a>;
profHTML + =< a href = \+ profile .public.profileUrl +\>;
profHTML + =< h2 class = myname>+ profile.firstName ++ profile.lastName +< / a>< / h2> ;
profHTML + =< span class = myheadline>+ profile.headline +< / span>;
profHTML + =< h3>+ profile.industry + < / h3>;
profHTML + =< h3>+ profile.location.name +< / h3>;
profHTML + =< h3>+个人资料.positions.values [0] .title +< / h3> ;
profHTML + =< h3>+ profile.positions.values [1] .title +< / h3>;
profHTML + =< h3> + profile.emailAddress +< / h3>;
$(#profiles)。html(profHTML);
});
}
< / script>
< / head>
< body>
< script type =IN / Logindata-onAuth =loadData>< / script>
< div id =profiles>< / div>
< div id =profiles1>< / div>
< / body>

personal_Info.html我需要显示LinkedIn数据。

 < body> 
< div id =container>
<节>
< div class =results>
< div class =results-head>
个人信息
< div class =pagecount> 1/6< / div>
< / div>
< div class =job-des>
< div class =row>
< input name =textfield2type =textid =textfield1value =First Nameclass =input-fieldonblur =if(this.value =='')> ;
< / div>
< div class =row>
< input name =textfieldtype =textid =textfield2value =Last Nameclass =input-field>
< / div>
< div class =row>
< input name =textfieldtype =textid =textfield3value =Street Addressclass =input-field>
< / div>
< div class =row>
< input name =textfieldtype =textid =textfield4value =Cityclass =input-field>
< / div>
< div class =row>
< select name =select2id =select2class =input_list2>
< option value =>国家< / option>
< / select>
< / div>
< div class =row>
< select name =select2id =select3class =input_list2>
< option>状态< / option>
< / select>
< / div>
< div class =row>
< select name =select2id =select4class =input_list2>
< option>区域< / option>
< / select>
< / div>
< div class =row>
< input name =textfieldtype =textid =textfield5value =Zip / Postal Codeclass =input-field>
< / div>
< div class =row>
< input name =textfieldtype =textid =textfield6value =Email Addressclass =input-field>
< / div>
< div class =row>
< input name =type =checkboxvalue =checked align =bottom>
授权在美国工作
< / div>



< / div>


< / div>
< div class =input-btn-panel>
< div class =input-btn-wrap>< input type =submitname =buttonid =buttonvalue =Nextclass =blue-btnonClick = updateTxt() >< / DIV>

< div id =profiles>< / div>
< / div>
< / body>

请给我一些提示。我不明白如何做到这一点?

解决方案

您可以使用HTML5本地存储。它可以让你告诉浏览器将数据保存在用户的机器上。 (还有会话存储空间,仅适用于当前会话。)



保存(在Apply.html中)

  IN.API.Profile(me)
.fields([id,firstName, (姓名),位置:(标题),emailAddress])
.result(function(result){
profile = result.values [0];

//将所有密钥保存到本地存储
for(f in profile)localStorage [f] = fields [f];

//更多东西...
});

检索(在personal_Info.html中)

  //从本地存储中检索名字
var firstName = localStorage [firstName];
if(firstName!== undefined){
$(#textfield1)。attr(value,firstName);
}


I know this question ask many times but my question is something different.
I have 3 html pages like apply.html, personal_info.html, resume info.html.

  1. In apply.html page:-
    I use one LinkedIn button for LinkedIn-login. when user click on that button and filling login information, it fetch user data from LinkedIn. And show it on same page(apply.html).

  2. In personal_info.html:-
    I need to show this personal information in respective TextField which we fetch from LinkdIn.

  3. In Resume_info.html:-
    Here I need to show Career information which we fetch on apply.html page using LinkedIn.

I don't understand how to do this? I am very new on Html,JavaScript.
Here is my code for your reference.

Apply.html where I fetch LinkedIn Date

<html>
<head>    
<script type="text/javascript"> 
function loadData() {
IN.API.Profile("me")
.fields(["id", "firstName", "lastName", "pictureUrl","headline","industry","location:(name)","positions:(title)","emailAddress"])
  .result(function(result) {
  profile = result.values[0];
  profHTML = "<p><a href=\"" + profile.publicProfileUrl + "\">";
  profHTML += "<img class=img_border align=\"left\" src=\"" + profile.pictureUrl + "\"></a>";      
  profHTML += "<a href=\"" + profile.publicProfileUrl + "\">";
  profHTML += "<h2 class=myname>" + profile.firstName + " " + profile.lastName + "</a> </h2>";
  profHTML += "<span class=myheadline>" + profile.headline + "</span>";
  profHTML += "<h3>" + profile.industry + "</h3>";
  profHTML += "<h3>" + profile.location.name + "</h3>";
  profHTML += "<h3>" + profile.positions.values[0].title + "</h3>";
  profHTML += "<h3>" + profile.positions.values[1].title + "</h3>";
  profHTML += "<h3>" + profile.emailAddress + "</h3>";
 $("#profiles").html(profHTML);
  });
 } 
</script>
</head>
<body>
<script type="IN/Login" data-onAuth="loadData"></script>
<div id="profiles"></div>
<div id="profiles1"></div> 
</body>  

personal_Info.html where I need to show LinkedIn data.

<body>
<div id="container">
<section>
<div class="results"> 
 <div class="results-head">
  Personal Info
  <div class="pagecount">1/6</div>
  </div>
  <div class="job-des">
   <div class="row">
     <input name="textfield2" type="text" id="textfield1" value="First Name"  class="input-field" onblur="if (this.value == '')">
   </div>
  <div class="row">
    <input name="textfield" type="text" id="textfield2" value="Last Name" class="input-field"> 
  </div>
  <div class="row">
    <input name="textfield" type="text" id="textfield3" value="Street Address" class="input-field"> 
  </div>
   <div class="row">
    <input name="textfield" type="text" id="textfield4" value="City" class="input-field"> 
  </div>
   <div class="row">
   <select name="select2" id="select2" class="input_list2">
      <option value="">  Country  </option>
    </select>
  </div>
   <div class="row">
    <select name="select2" id="select3" class="input_list2">
      <option>State</option>
    </select>
  </div>
   <div class="row">
     <select name="select2" id="select4" class="input_list2">
      <option>Region</option>
    </select>
  </div>
   <div class="row">
    <input name="textfield" type="text" id="textfield5" value="Zip/Postal Code" class="input-field"> 
  </div>
  <div class="row">
    <input name="textfield" type="text" id="textfield6" value="Email Address" class="input-field"> 
  </div>
   <div class="row">
   <input name="" type="checkbox" value="" checked align="bottom"> 
   Authorization to work in U.S.
  </div>



  </div>


</div>
<div class="input-btn-panel">
  <div class="input-btn-wrap"><input type="submit" name="button" id="button" value="Next" class="blue-btn" onClick="updateTxt()"></div>

 <div id="profiles"></div>
</div>
</body>   

Please give me some hint. I don't understand how to do this?

解决方案

You could use the HTML5 local storage. It lets you tell the browser to save data on the user's machine. (There's also session storage, valid only for the current session.)

Save (in Apply.html)

IN.API.Profile("me")
.fields(["id", "firstName", "lastName", "pictureUrl","headline","industry","location:(name)","positions:(title)","emailAddress"])
  .result(function(result) {
      profile = result.values[0];

      // save all keys to local storage
      for (f in profile) localStorage[f] = fields[f];

      // more stuff ...
  });

Retrieve (in personal_Info.html)

// retrieve first name from local storage
var firstName = localStorage["firstName"];
if (firstName !== undefined) {
    $("#textfield1").attr(value, firstName);
}

这篇关于如何在JavaScript中将值从一个html页面传递到另一个页面?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆