2017-02-13 80 views
0

所以我有一個「快速註冊」類小部件在我的頁腳中只有名字和姓氏文本框。我也有一個按鈕,點擊後重定向到實際的註冊頁面。我的意圖是將輸入的信息輸入到文本框中,並在註冊表中填寫匹配的第一個/最後一個名稱文本框。如何存儲文本框的值以便以後使用Javascript?

document.querySelector(".footerSignUp").onclick = function() { 
 
var footerFirst = document.querySelector(".footerFirstName").value; 
 
var footerLast = document.querySelector(".footerLastName").value; 
 
alert(footerFirst,footerLast); 
 
location.href = " http://localhost/wordpress/my-account/register/ "; 
 
};
<input type="text" class="input-text footerFirstName" name="billing_first_name" value="Firstname" /> 
 

 
<input type="text" class="input-text footerLastName" name="billing_last_name" value="Lastname" /> 
 

 
<input type="button" value="Sign-up" class="footerSignUp" />

感謝

+1

可能重複[如何在javascript中的不同html頁面之間傳遞變量值](http://stackoverflow.com/questions/23213788/how-to-pass-variable-value-between-different-html-pages- in-javascript) – Turnip

回答

0

您必須將值附加的查詢參數和有邏輯的重定向的URL來提取信息,並填充輸入要素。

頁與click事件

document.querySelector(".footerSignUp").onclick = function() { 
    var footerFirst = document.querySelector(".footerFirstName").value; 
    var footerLast = document.querySelector(".footerLastName").value; 
    var url = getUrl(firstName, lastName); 
    location.href = url; 
}; 

function getUrl(firstName, lastName) { 
    var url = 'http://localhost/wordpress/my-account/register/'; 
    var params = "firstName=" + firstName + "&lastName=" + lastName; 

    return [url, params].join('?'); 
} 

提取物在註冊頁面

// In the registration page extract the params 

function extractParams() { 
    var url = location.href; 
    // Extract the query params from the url 
    var queryParams = url.split('?')[1]; 
    // Extract individual params 
    var params = queryParams.split('&'); 

    params.forEach(function(param) { 
     var data = param.split('='); 
     var key = data[0]; 
     var value = data[1]; 
     var selector; 

     if(key === 'firstName' && value) { 
      selector = '.footerFirstName'; 
     } else if(key === 'lastName' && value){ 
      selector = '.lastFirstName'; 
     } 

     if(selector) { 
      document.querySelector(selector).value = value; 
     } 
    }); 
} 

extractParams(); 

編輯

在第2頁獲得url

var url = location.href; 
var params = url.split('?')[1]; 

//And then set the new redirect 
location.href = newLocation + '?' + params; 
+0

哎謝謝你的回答!你的代碼正在做你想要的,我可以在URL中看到附加值。我所需要的只是變量名稱,因爲它們從「footerFirst」變成了「firstName」,但沒什麼大不了的。但是,我忘了提及我在頁腳註冊和註冊表頁面之間有一個頁面。這是一個詢問用戶帳戶是否適合公司或個人的頁面。無論如何,要讓url中的值留在那裏再多一次重定向? –

+0

它必須插入到以下URL'http:// localhost/wordpress/my-account/register/personal-account-registration /'&'http:// localhost/wordpress/my-account/register/company -account-registration /' –

+0

@SebG很高興有幫助:) –

0

您可以使用localStorage

由於cors/sandbox,代碼片段可能無法在此工作。

function storeData(){ 
 
    var firstName = document.getElementById('firstName').value; 
 
    var lastName = document.getElementById('lastName').value 
 
    var userData = { 
 
    'firstName': firstName, 
 
    'lastName': lastName 
 
    } 
 
    localStorage.setItem('userData', JSON.stringify(userData)); 
 
}
<input type="text" id='firstName' class="input-text footerFirstName" name="billing_first_name" value="Firstname" /> 
 

 
<input type="text" id='lastName' class="input-text footerLastName" name="billing_last_name" value="Lastname" /> 
 

 
<input type="button" onclick="storeData()" value="Sign-up" class="footerSignUp" />

然後,登記表頁面上:

window.onload = function getUserData(){ 
 
    var userData = JSON.parse(localStorage.getItem('userData')); 
 
    localStorage.clear() 
 
    console.log(userData); 
 
}

它將存儲保存用戶的firstNamelastNameuserData變量。

相關問題