我有三个下拉列表集,其中三个单独的输入显示在从列表中选择值“other”时。以下代码仅用于选择对所单击项目的最近输入。
Set 1
@Html.DropDownListFor(m => m.Title, "--Select Title --", new { @class = "form-control requiredField dropListFunction", required="true" })
set2
@Html.TextBoxFor(m => m.TitleOther, new { @class = "form-control hidden", placeholder = "Enter New Title" })
@Html.DropDownListFor(m => m.Branch "--Select Branch --", new { @class = "form-control requiredField dropListFunction", required = "true" })
@Html.TextBoxFor(m => m.BranchOther, new { @class = "form-control hidden", placeholder = "Enter New Branch" })
Set 3
@Html.DropDownListFor(m => m.State, Enum.GetNames(typeof(State)).Select(e => new SelectListItem { Text = e }), "--Select State --", new { @class = "form-control requiredField dropListFunction", required = "true" })
@Html.TextBoxFor(m => m.StateOther, new { @class = "form-control hidden", placeholder = "Enter New State" })
使用以下jquery处理选择最接近dropListFunction的输入,该输入包含一个带有其他值的单击选项
$('option[value=Other]').on('click',function(){
var nextInput = $('.dropListFunction').next('input');
nextInput.removeClass('hidden')
});
问题在于它不仅仅选择列表中的下一个项目,而是在选择时打开所有隐藏的输入。非常感谢任何帮助
答案 0 :(得分:2)
所有DropDowns都有类.dropListFunction,因此您将获得所有下一个输入。
$('.dropListFunction').on('change', function(e){
var dd = $(e.target), input = dd.next('input');
if(dd.val() === 'other'){
input.removeClass('hidden');
}else{
input.addClass('hidden');
}
});
在这里看到jsbin