html - 选择选项打开唯一的文本框

Question

我想要两个不同的选择选项，比如说，电子邮件或电话号码等选项，当您选择电子邮件选项时，会在其下方打开一个文本框，显示“输入电子邮件”，或者当您选择电话号码选项时文本框在其下方打开，显示“输入电话号码：”。

附言。我不想同时显示两个文本框，我希望他们选择要填充的文本框。如果您有更好的方法，请告诉我您的想法。

<form action="order-step4.php" method="post"> 

    Please fill out these fields:<br /> 
    Recipient: <input type="text" name="recipient" /><br />

    Recipient Email: <input type="text" name="remail" /><br /> 

    Recipient Cell: <input type="text" name="rsms" /><br /> 

    Your Message :<input type="text" name="message" /><br /> 

    <input type="submit"> 
 </form>

谢谢你，乍得。

Answer 1

有一个用于选择电话或电子邮件的下拉选项，并在下拉更改时显示/隐藏相应的输入文本框。

<select id="myChoice">
  <option value="email">Email</option>
  <option value="phone">Phone</option>
</select>

这是功能

$('#myChoice').change(function() {
       if ($(this).val() === 'email') {
           //show email
           //hide phone

        } else {
            //hide email
           //show phone
        }
});