使用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頁面中的文本字段的數據

回答

相關問題