我从下拉列表中获取输入,并根据用户选择我想要显示/隐藏不同输入。我曾尝试使用boolean与boolean但它没有响应它应该。
我的期望我发送真实切换然后它显示输入或如果它已经显示它保持这种方式。如果我发送虚假它隐藏或隐藏它就会保持这种状态。
正如你所看到的那样,父母'和孩子'将第一个值设置为true,当我从子节点切换到父节点时(第一个名称在网站加载时可见)它隐藏,当我切换到管理员时,即使它显示为假。
$(document).ready(function () {
var user = $("[id*=userTypeDD]").val();
$("[id*=userTypeDD]").on("change", function () {
user = $("[id*=userTypeDD]").val();
hideInputFields(user);
});
});
function hideUserInputFields(user) {
if (user == "Child") {
hideInputFields(true, true, false, false, false);
}
if (user == "Parent") {
hideInputFields(true, true, true, true, true);
}
if (user == "Administrator") {
hideInputFields(false, false, false, false, false);
}
}
function hideInputFields(firstNameIsVisible, surnameIsVisible, postcodeIsVisible, telephoneIsVisible, emailIsVisible)
{
$("[id*=firstNameTxt]").closest("tr").toggle(firstNameIsVisible);
}
标记(ASP.NET)
<asp:DropDownList ID="userTypeDD" runat="server" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged">
<asp:ListItem>Child</asp:ListItem>
<asp:ListItem>Parent</asp:ListItem>
<asp:ListItem>Administrator</asp:ListItem>
</asp:DropDownList>
</td>
<td> </td>
</tr>
<tr>
<td class="text-right" style="width: 574px">
<asp:Label ID="firstNameLabel" runat="server" Text="First name: "></asp:Label>
</td>
</tr>
</table>
编辑:在我看来,无论我传递给切换的布尔值,它都可以随时切换TR
答案 0 :(得分:0)
您在下拉的更改事件中调用了错误的函数。改变这个......
$("[id*=userTypeDD]").on("change", function () {
user = $("[id*=userTypeDD]").val();
hideInputFields(user);
});
要
$("[id*=userTypeDD]").on("change", function () {
user = $("[id*=userTypeDD]").val();
hideUserInputFields(user);
});
这就是为什么不能如此相似地命名你的功能的原因。您的hideUserInputFields
是一个误导性的名称,因为它不是那样做的功能。你最好称之为handleUserSelectionChange
。那么你可能不会有这个错误。你的其他功能名称是有意义的。