如何从下拉列表 asp.net mvc 中的选定值中隐藏 div

Question

所以我有一个下拉列表（下方），

 @Html.DropDownListFor(model => model.Reference, ViewBag.ISharedUI as
 SelectList, "-- REFERENCE TYPE --")
    @Html.ValidationMessageFor(x => x.reftab)

我有 2 个 div 是（下面）

    <div class="widgetbox" id="divone">
    Some contents
    </div>

和

<div class="widgetbox" id="divtwo" style="visibility:hidden">
Some contents
</div>

所以我需要做的是，从下拉列表中select某个值，它会隐藏第一个div并显示第二个div，当我select另一个值，反之亦然。所有代码都在我的视图文件中。我可以做出什么改变？我希望我的解释很清楚。抱歉英语不好。谢谢

编辑：如图，div两个可见性设置为隐藏。当下拉列表中的某些值是 selected

时，我希望显示它并 div 隐藏它

Answer 1

使用 javascript 这样做。

在 javascript 中创建一个函数来触发 Change 事件，您将在此函数中获取当前选定的项目。然后你可以在那里执行你的逻辑。

$(function() {
$("#Reference").change(function() {
    alert( $('option:selected', this).text() );
    // Your show hide logic goes here 
});

});

Answer 2

@Html.DropDownListFor(model => model.Reference, ViewBag.ISharedUI as
 SelectList,  ,   new { @onchange="toggleDIvDisplay(this.value)" }

////然后在脚本部分添加 javascript 函数

function toggleDIvDisplay(e)
    {
    if(e == desiredvalue)
    {
    $('#divtwo').show();
    }
    else
    {
    $('#divtwo').hide();
    }
    }

如何从下拉列表 asp.net mvc 中的选定值中隐藏 div

how to hide a div from a selected value in dropdownlist asp.net mvc

asp.net

asp.net-mvc

drop-down-menu