Question

我希望有一个选项打开相应的文本框。

让我们说这些是我的选择：

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

当您选择电子邮件选择时，我希望它在其下方显示一个文本框（之前不存在），请输入您的电子邮件。

OR

当您选择手机选择时，我希望它在其下方显示一个文本框（之前不存在），请输入您的电话号码。

我不希望同时显示“输入电子邮件”和“输入电话号码”文本框。我希望他们选择打开哪一个并输入他们的联系信息。

我目前有这个，但不知道还有什么...请帮忙！

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

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

谢谢，乍得。

Answer 1

我有类似的要求，解决方案是：

<HTML>
<BODY>
<form name="myform">
<table>
<tr>
<td>
<select name="one" onchange="if (this.value=='other')   {this.form['other'].style.visibility='visible'}else     {this.form['other'].style.visibility='hidden'};">
<option value="" selected="selected">Select...</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="other">Other</option>
</select>
<input type="textbox" name="other" style="visibility:hidden;"/>
</td>
</tr>
</table>

Answer 2

想出来，使用以下javascript：

<script type="text/javascript">
function CheckContact(val){
 var element=document.getElementById('email');
 if(val=='email')
   element.style.display='block';
 else
   element.style.display='none';

 var element=document.getElementById('sms');
 if(val=='sms')
   element.style.display='block';
 else
   element.style.display='none';
}
</script>

然后以下面的形式：

<select name="contactinfo" id="contactinfo" onchange="CheckContact(this.value);">
  <option>Select Contact Option</option>
  <option value="email">Email</option>
  <option value="sms">Text (SMS)</option>
</select><br />
<div id="email" style="display: none;">Enter Email: <input type="text" name="email" /><br /></div>
<div id="sms" style="display: none;">Enter Cell Number: <input type="text" name="sms" /><br /></div>

选择选项可打开新文本框

2 个答案: