Javascriptを使用してHTML FORMデータをあるページから別のページに送信しようとしています。ここに私のコードです。 FORM.htmlページの「NAME」フィールドにテキストを入力しているとします。送信後、DISPLAY.htmlページにテキストが表示されます。どうやってするの？あなたはあなたがFORM.htmlフォームにJavaScriptを使用して1つのページから別のページにHTML FORMデータを送信する方法
を提出するときは、URLに名前を保存
<html>
<head>
<title>Display</title>
</head>
<body>
<p id="show">
Name: <!-- want to display the name here -->
</p>
</body>
</html>
DISPLAY.html
FORM.htmlに
<html>
<head>
<title>FORM</title>
</head>
<body>
<form method="GET" action="display.html">
NAME: <input type="text" name="name">
<input type="submit" value="Submit">
</form>
</body>
</html>
を助けてください実行するjavascript関数を使用してDISPLAY.htmlフォームを読み込むと、URLから名前を読み取ることができますオンロードページ。
あなたはこの1のためにあなたのDISPLAY.htmlを交換する必要があります。それはあなたがURL内の複数の要素を持っている場合には、少なくともクロム
と私のために働いた
<html>
<head>
<title>Display</title>
</head>
<body onload="getName()">
<p id="show">
<div id='myDiv'>Name: <!-- want to display the name here -->
</div>
</p>
</body>
<script type="text/javascript">
function getName()
{
var name = window.location.href.split("?name=")[1].split("+").join(" ");
var fieldNameElement = document.getElementById('myDiv');
var oldText=fieldNameElement.innerHTML;
fieldNameElement.innerHTML = oldText+' '+name;
}
</script>
</html>
、あなたはスプリットを使用することができますし、あなただけの、あなたJavaScriptでそれを行ってしたい場合は、「&」
よろしく
3つの変数を使用してその名前を取得するのはなぜですか？ var name = window.location.href.split（ "？name ="）[1]; – Nick
はい、あなたのソリューションはより効率的です。私はあなたと私の編集、ありがとう！ –
ありがとう...このコードは動作していますが、スペースが印刷されないという問題があります。私が "Danny Boyle"と入力したとします。それは "Danny + Boyle"と表示されています。 –
間の要素を取得nameオブジェクトをローカルに格納するためにwindow.localStorageプロパティを使用できます。
Form.html
<html>
<head>
<title>FORM</title>
</head>
<body>
<form id="form" method="GET" action="display.html">
NAME: <input type="text" name="name" id="name">
<input type="button" value="Submit" onclick="submitForm()">
</form>
<script>
function submitForm(){
if(typeof(localStorage) != "undefined"){
localStorage.name = document.getElementById("name").value;
}
document.getElementById("form").submit();
}
</script>
</body>
</html>
Display.html
<html>
<head>
<title>Display</title>
</head>
<body onload="setData()">
<p id="show">
Name: <!-- want to display the name here -->
</p>
<script>
function setData(){
if(typeof(localStorage) != "undefined"){
document.getElementById("show").innerHTML = localStorage.name;
}
}
</script>
</body>
</html>
コードをありがとうございます。それは私のために働いていますが、問題は、名前を送信するために「Enter」ボタンを押したときに、以前の名前を表示しているということです。新しい名前が表示されていません。 –
あなたがクッキーを設定したり、ブラウザのセッションを使用するためにJavascriptを使用することができますPHPのようなサーバー・テクノロジーを使用しない場合ストレージ 。しかし、これは一般的にフォームとアプリケーションが動作する方法ではありません。 チェックアウト：https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage – Cagy79