Question

我正在构建一个无缝注册页面，该页面将数据从一个注册页面发送到另一个注册页面，而我无法控制使用我在工作中使用的平台。除了平台提供的注册页面外，有些客户希望使用自定义注册页面，因此我们需要从头开始创建注册页面。

这就是我到目前为止所创建的：

<h1>Form 2</h1>
<form action="
" method="get"> 



<label for ="first">First:</label> 
<input type="text" name="FirstName" id="first"><br>
<label for ="last">Last:</label> 
<input type="text" name="LastName" id="last"><br>

<label for ="company">Job Title:</label> 
<input type="text" name="JobTitle" id="JobTitle"><br>




<label for ="city">City:</label> 
<select name="City">
    <option value="BuenosAires">Buenos Aires</option>
    <option value="Toronto">Toronto</option>
    <option value="Madrid">Madrid</option>
    <option value="MexicoDF">Mexico DF</option>
  </select><br/>




<label for ="country">Country:</label> 
<select name="Country">
    <option value="Argentina">Argentina</option>
    <option value="Canada">Canada</option>
    <option value="Spain">Spain</option>
    <option value="Mexico">Mexico</option>
  </select><br/>

   <input type="radio" name="joke" value="bed" /> A Bed<br>
  <input type="radio" name="joke" value="pillow"  /> pillow<br>
  <input type="radio" name="joke" value="chair" /> chair<br>
  <input type="radio" name="joke" value="light"  /> light<br>

   <label for ="email">Email:</label>
  <input type="text" name="EMailAddress" id="email"><br>

  This is Checked <input type="checkbox" id="scales" name="scales"
        ><br/>



<input type="submit">
</form>

第一个reg页面看起来一样。它只是在模拟真实项目的样子，因此此时的值没有意义。

这是Jquery代码：

$(document).ready(function(){

function processForm(){
var parameters = location.search.substring(1);
//var substr = parameters.substr(parameters.indexOf('FirstName'), parameters.length-1);
var substr = parameters.substr(0, parameters.length);
var temp = (substr.split("&"));
//names that appear in the URL on top
var values=[];
var urlName;
var urlNameArr=[];
var urlResult;
var urlResultArr=[];
var urlBoth;
var urlBothArr=[];
var name;
var value;
for(var i=0; i<temp.length;i++){
 //values.push(decodeURIComponent(temp[i].substr(temp[i].indexOf('=')+1, temp[i].length )));
 urlName = temp[i].substr(0,temp[i].indexOf("="));
     urlNameArr.push(urlName);
 urlResult = temp[i].substr(temp[i].indexOf("=")+1, temp[i].length);        
     urlResultArr.push(decodeURIComponent(urlResult));

urlBothArr.push([urlName, decodeURIComponent(urlResult)]); 









}//urlNames


var inputNameArr=[];
var result=[];
var input=$('form input, select  ');
//console.log(input);
var inputRadio =$('form [type=radio]  ');
//console.log(inputRadio.length);
console.log($('form [type=text]  '));


//This is used for the input radio. It works*
for (x in inputRadio){
//console.log(inputRadio[x].value);
for(var y=0;y<urlBothArr.length;y++){
//console.log(urlBothArr[y][0]);
if(urlBothArr[y][1]===inputRadio[x].value){
$("input[type=radio][name='"+urlBothArr[y][0]+"'][value='"+urlBothArr[y][1]+"']").prop('checked', true);
};
};
}


for (j in input){
//var j=0;j<input.length; j++
inputNameArr.push(input[j].name);
//console.log(inputNameArr);

//console.log(input[j].value);
function sortFunc(a,b){
return inputNameArr.indexOf(a[0]) - inputNameArr.indexOf(b[0]);

}//sort
urlBothArr.sort(sortFunc);
//console.log(urlBothArr);




urlBothArr.map(function(x, i){


//console.log(inputNameArr);






if(x[0] === inputNameArr[i]){
input[i].value = urlBothArr[i][1];
//console.log(input[i].value);

//$("input[name='"+x[0]+"'][value='"+urlBothArr[i][1]+"']").prop('checked', true);//check this code later
}
//console.log(input[i].value)
 //if(x[1] === input[i].value){//Check later
 //$("input[type=radio][name='"+x[0]+"'][value='"+urlBothArr[i][1]+"']").prop('checked', true);
 //}
//console.log(x);

})//map

}//for

name=urlBothArr[urlBothArr.length-1][0];
value =urlBothArr[urlBothArr.length-1][1];
//console.log(inputNameArr)




}//processForm
processForm();

})

基本上，此代码执行的操作是获取出现在第二个表单的URL中的信息，并获取该信息并填充字段。如果我按此顺序保持字段有效，但是当我开始将无线电输入位置的位置移动到另一个位置时，假设将整个块放在电子邮件字段的顶部，该字段将变为空白，并且reg页面看起来不完整。

正如我所说的，这只是一个模板，可以作为实际项目的基础

使用jQuery将表单信息从一个字段传递到另一个字段

0 个答案: