如何使用jquery根据选择值隐藏和显示文本框

时间:2011-07-13 10:09:57

标签: jquery asp.net-mvc

我想根据下拉选择值隐藏和显示我的文本框。如果用户选择下拉值“其他”然后我想显示我的文本框并隐藏下拉列表,他可以选择任何值,除了其他我的文本框是隐藏PLZ帮助我,并给我示例代码我的代码在这里

 <script type="text/javascript">
  $( function () {

 if($("#subject").val()==="Other") {
     $("#Sub").show();
  $("#subject").hide();

  }
  else $("#Sub").hide(); 
    });

  <tr> <td style="width: 470px"><%:Html.DropDownList("subject",ViewData["sub"] as SelectList) %> 

      <input type ="text"  name="subject" id="Sub"style="width: 250px" /></td></tr>

我从数据库填充了下拉列表

2 个答案:

答案 0 :(得分:6)

要执行此操作,您必须在选择的“更改”事件上附加事件(并首先隐藏文本输入)。试试这个:

$("#Sub").hide();
$("#subject").change(function(){
    if ($(this).val() === "Other"){
        $("#Sub").show(); 
        $("#subject").hide();
    }else{
        $("#Sub").hide();
    }
});

答案 1 :(得分:1)

试试这个

  <tr> <td style="width: 470px"><%:Html.DropDownList("subject",ViewData["sub"] as SelectList,new {onchange="ShowHideTextBox()"}) %> 

  <input type ="text"  name="subject" id="Sub" style="width: 250px" /></td></tr>

<强>的javascript

  <script type="text/javascript">
function ShowHideTextBox() {

    if($("#subject").val().toUpperCase()=="OTHER") {
         $("#Sub").show();
         $("#subject").hide();
    }
    else
    {
       $("#Sub").hide(); 
    } 
}
</script>