使用jquery检索另一个HTML页面中的文本字段的数据

-2

我试图将form.html中的文本字段的值复制到main.html。首先，main.html将启动。然后，form.html将在点击'添加'按钮后显示，用户将输入一个值，点击'提交'，控件应该被转回main.html，给出该文本的值，警报形式的字段。请帮我实现这一点。使用jquery检索另一个HTML页面中的文本字段的数据

<!-- form.html --> 
<!DOCTYPE html> 
<html> 
<head> 
    <script type="text/javascript" src="jquery-1.11.3.js"></script> 
    <meta charset="ISO-8859-1"> 
    <title></title> 
    <script type="text/javascript"> 
     $(function(){ 
      $("#submit").click(function(){ 
       location.href = "index.html"; 
      }); 
     }); 
    </script> 
</head> 

<body> 
    Number : <input type="text" id="no"> 
    <br><br> 
    <a href="index.html"><input type="button" id="submit" value="Submit"></a> 
</body> 
</html> 


<!-- main.html --> 
<!DOCTYPE html> 
<html> 
<head> 
    <script type="text/javascript" src="jquery-1.11.3.js"></script> 
    <meta charset="ISO-8859-1"> 
    <title></title> 
    <script type="text/javascript"> 
     $(function(){ 
      var e; 
      $("#add").bind("click", function(){ 
       $("#temp").load("form.html", function(data){ 
        location.href="form.html"; 
        e = $("#no").val(); 
       }); 
      }); 
      $("#disp").html(e); 

     }); 
    </script> 
</head> 

<body> 
    <div id="temp" style="display:none;"></div> 
    <input type="button" id="add" value="Add"> 
    <div id="disp"></div> 
</body> 
</html>

来源

2015-08-25 AV8

为什么不使用'localStorage'？ – Xlander

或cookie或iframe或新窗口或使用'get'方法并从查询字符串读取。 –

http://www.w3schools.com/html/html5_webstorage.asp –

$(function(){ 
 
      var e; 
 
      $("#add").bind("click", function(){ 
 
       $("#temp").load("form.html", function(data){ 
 
\t \t \t \t $("#temp").css({'display':'block'}); 
 
\t \t \t \t $("#add").css({'display':'none'}); 
 
       }); 
 
      }); 
 
      $("#disp").html(e); 
 
\t \t \t $("#submit").click(function(){ 
 
       alert($('#no').val()); 
 
      }); 
 

 
     });

<!-- main.html --> 
 
<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
    <meta charset="ISO-8859-1"> 
 
    <title></title> 
 

 
</head> 
 

 
<body> 
 
    <div id="temp" style="display:none;"></div> 
 
    <input type="button" id="add" value="Add"> 
 
    <div id="disp"></div> 
 
</body> 
 
</html>

<!-- form.html --> 
 
<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 

 
    <meta charset="ISO-8859-1"> 
 
    <title></title> 
 
</head> 
 

 
<body> 
 
    Number : 
 
    <input type="text" id="no"> 
 
    <br/> 
 
    <br/> 
 
    <a href="index.html"> 
 
    <input type="button" id="submit" value="Submit"> 
 
    </a> 
 
</body> 
 

 
</html>

来源

2015-08-25 12:57:57

这似乎不起作用... – AV8

如果form.html是在单独的窗口由main.html打开，则它可以使用the window.opener property回头参照main.html。

所以在main.html你可能有这样的事情：

function setValue(value) { 
    document.getElementById('someID').value = value; 
}

然后在form.html您可以调用该函数：

window.opener.setValue(document.getElementById('anotherID').value);

您的代码可能会更多地参与，当然。但总体思路是，当窗口A打开窗口B时，窗口B直接引用窗口A的window对象。

来源

2015-08-26 13:23:29 David

使用jquery检索另一个HTML页面中的文本字段的数据

回答

相关问题