Question

很抱歉，如果这是非常明显的，但我已经查找并寻找解决方案，但没有找到任何东西。我对jQuery很新，所以即使找我想做的事情也很难。

我有一个页面，其中包含从数据库填充的一堆字段和下拉框。因此，每个下拉列表都会在页面加载时选择正确的项目（存储在数据库中的项目）。当该选项为“其他”时，我希望我的“其他”文本框显示出来。

所以，问题是;如何在页面加载时根据选定的下拉项显示/隐藏该文本框？我在研究中找到的所有东西都与下拉菜单的变化有关。这适用于我拥有的其他页面之一。我不想重新选择“其他”（触发更改事件）。

由于

Answer 1

$(function() {
    if($("#yourDropDown").val() == 0) //I'm supposing the "Other" option value is 0.
         $("#yourTextBox").hide();
});

Answer 2

$("option").bind('click', function(){
    var selected = $(this).val();
    alert(selected+' selected');
    if (selected == '1') { /* do anything you want */ }
    if (selected == '2') { /* do anything you want */ }
    //etc ...
});

Answer 3

我必须做这件事。这是我使用的代码：

$(function() {
    var 
    jqDdl = $('#ddl'),
    onChange = function(event) {
        if ($(this).val() === 'Other') {
            $('#otherTxtbox').show();
            $('#otherTxtbox').focus().select();
        } else {
            $('#otherTxtbox').hide();
        }
    };
    onChange.apply(jqDdl.get(0)); // To show/hide the Other textbox initially
    jqDdl.change(onChange);
});

Answer 4

如果你有一个选择框，即

<select class="myselect">
   ....
</select>

您可以绑定到.change()，即

$('.myselect').change(function() {
       --> do show hide here.
});

查找jquery .show()和.hide()。（http://api.jquery.com/show和http://api.jquery.com/hide）。

Answer 5

假设默认情况下你的html有两个框，而“其他”框则被隐藏。

val = $('#myselect').val();

switch( val ) {

  case "Other":

    $('#mybox').hide();

    $('#myotherbox').show();

    break;

}

Answer 6

请尝试使用此代码，希望它可以正常工作

    <asp:TextBox ID="txtOtherEntity" runat="server" style="display:none;" ></asp:TextBox>

    $(function() {
$("#ddlEntity").change(function() {
    var selectedVal = $('option:selected', this).text();
    if(selectedVal == "Other")
    {
         $('#txtOtherEntity').css('display', 'block');

    }
    else
    {
        $('#txtOtherEntity').css('display', 'none');
    }
});

jQuery - 如何根据选定的下拉列表显示/隐藏文本框

6 个答案: