JQuery - 实时复制字段输入文本

我试图弄清楚如何将一个表单字段中的用户文本输入复制到另一个表单字段中。具体来说，当有人在联系表单中填写其电子邮件地址时，该地址将在邮件列表表单中重复。

这两种表单都使用 ajax，因此不必担心输入文本在提交时丢失。

这是我的代码：

    <div id="contact_form">
          <form name="contact" method="post" action="">

            <input type="text" name="name" id="name" size="30" value="Name" class="text-input" />
            <label class="error" for="name" id="name_error">Please enter your name.</label>
            <br />

            <input type="text" name="email" id="email" size="30" value="Email" class="text-input" />
            <label class="error" for="email" id="email_error">I need your email.</label>
            <br />

            <textarea rows="10" cols="30" type="textarea" name="message" id="message" value="Message" class="text-input" ></textarea>
            <label class="error" for="message" id="message_error">A message is required.</label>

            <br />
            <input type="submit" name="submit" class="button" id="submit" value="Send" />

          </form>
</div>

<div id="details">
    <p>some details here, not sure what yet</p>
    </div>

<div id="mail_list">
    <input type="text" id="mail" value="Your email" name="mail_list" /><input type="submit" name="submit" class="button" id="submit" value="Send" />
    </div>

我在 Jquery 文档中找到了这个，但无法让它工作：

$("#email").optionCopyTo("#mail");

Thanks!

你说你想要它即时的。我认为这意味着当用户键入时，应该为每次击键复制该值。

如果这是正确的，请尝试以下操作：

var mail = document.getElementById("mail");

$("#email").keyup(function() {
    mail.value = this.value;
});

或者如果你想要更多 jQuery：

var $mail = $("#mail");

$("#email").keyup(function() {
    $mail.val( this.value );
});

这将为每个更新keyup event.

我可能会添加一个多余的blur事件，以防字段中有自动完成。

$("#email").blur(function() {
    $mail.val( this.value );
});