17

ユーザーが他のページにあるリンクをクリックしたときに、連絡先フォームのフィールドに事前入力する簡単な方法を探しています。

これはhtmlの私の連絡先フォームです:

<form method="post" action="submit.php" >
    <p>Your name:
    <br /><input name="name" /></p>
    <p>Your email:
    <br /><input name="email" /></p>
    <p>Your message:
    <br /><textarea name="message" id="message" rows="10" cols="50"></textarea></p>
    <p><input type="submit" value="Send" /></p>
</form>

ユーザーが次のようなURLをクリックしたときに、「メッセージ」フィールドに「テキスト」を入力したいwww.xyz.com/contact.html?setmessagefield=some_text

4

4 に答える 4

20

JavaScriptには、そのようなurlパラメーターを解析するための組み込み関数がありません（これらのGETパラメーターは通常サーバーにデータを送信するために使用されるため）。
代わりにハッシュを使用することをお勧めします（ハッシュは純粋にクライアント側です）：

www.xyz.com/contact.html#name=some_text&email=more%20text

次に、フィールドにいくつかの'を追加idします。

<p>Your name:
<br /><input name="name" id="name" /></p>

<p>Your email:
<br /><input name="email" id="email" /></p>

次に、ロード時に次のように値を設定します。

var hashParams = window.location.hash.substr(1).split('&'); // substr(1) to remove the `#`
for(var i = 0; i < hashParams.length; i++){
    var p = hashParams[i].split('=');
    document.getElementById(p[0]).value = decodeURIComponent(p[1]);;
}

実例

これの大きな利点は、柔軟性があることです。2つのフィールドの値を設定する場合はid、ハッシュでこれらの2つのフィールドを指定します。

www.xyz.com/contact.html#name=some_text&email=more%20text

4つのフィールド？4つのID：

www.xyz.com/contact.html#name=some_text&email=more%20text&username=john&age=23

その後、コードを編集する必要はありません。

于 2012-12-28T13:23:49.080 に答える
1

を使用して現在のURLを取得window.location.hrefし、正規表現を介してデフォルトのメッセージを取得できます。

var msg = window.location.href.match(/\?setmessagefield=(.*)/);
document.getElementById("message").value = msg[1];
于 2012-12-28T13:33:38.117 に答える