Question

我正在开发一个应用程序，我正在使用country（下拉列表）和state（下拉列表）。

问题是当1选择country时，它的状态将填入state下拉列表，但状态列表仅提供给美国，而其他国家/地区未提供，因此他们必须输入。< / p>

那么如何基于USA（state）更改country输入类型（TEXTBOX或DROPDOWNLIST）。那是

If USA -DROPDOWNLIST Else Other Countries -TEXTBOX

Answer 1

默认情况下我会选择一个选择框，然后使用这个jQuery来改变它。

if($(#country_select).val() != 'USA'){
  $('#selectbox').attr('type', 'textbox');
  $('#selectbox option').remove();
}

注意

这是一个非常简单的解决方案，并要求默认值为USA。我认为有足够的信息来构建更强大的解决方案。

Answer 2

嗨，在国家/地区下拉列表中附加一个事件onchange并切换selectedValue，如果它是其中一个国家没有城市隐藏下拉列表并显示文本框，反之亦然。

<select id="country" onchange="check(this)">
  <option value="Select">Select</option>
  <option value="USA">USA</option>
  <option value="EG">EG</option>    
</select>

<select id="s_city">
</select>

<input type="text" id="t_city" style="display:none;">

脚本

function check(s)
{
    document.getElementById('t_city').value ='';
    document.getElementById('s_city').innerHTML='';


   var c= s.options[s.selectedIndex].value;
   //Here You Can Start Loading your states with each country
   if(c !="USA")
   {
    document.getElementById('t_city').style.display='block';
    document.getElementById('s_city').style.display='none';
   }
  else
   {
    document.getElementById('t_city').style.display='none';
    document.getElementById('s_city').style.display='block';
   }
}

我希望这个例子帮助

Answer 3

使用DOM / Inner HTML方法可以实现这一目标。

没有JQuery的innerHTML方法

<select id='country_select'>
<div id='container'>
<input ...>
</div>

if (document.getElementById ("country_select").value != "USA")
{
document.getElementById("container").innerHTML = "<input ...>";
}
else
document.getElementById("container").innerHTML = "<select ...>";

Answer 4

这里的想法是你需要一个状态下拉列表和一个文本框。如果您希望首先显示下拉列表，则不显示文本框或交叉更改。

虽然我的解决方案与Marvan非常相似，但请看一下这里的实例

http://jsfiddle

供其他参考。如果你打算将它与表单一起发送，我想这个名字必须是相同的。

Answer 5

我会有一个状态下拉列表和其他国家/地区的文本框。

HTML

<select id="cboCountry">
    <!-- <option value="USA">USA</option> -->
    <!-- etc -->
</select>
<select id="cboState">
    <!-- <option value="Alabama">Alabama</option> -->
    <!-- etc -->
</select>
<input type="text" id="txtState" style="display:none;" />

的Javascript

$('#cboCountry').change(
    if($('#cboCountry').value() != 'USA'){
        $('#txtState').show();
        $('#cboState').hide();
    }
    else
    {
        $('#txtState').hide();
        $('#cboState').show();
    }
);

如何根据另一个下拉列表将dropdownlist更改为textbox，反之亦然

5 个答案: