Javascript 无法隐藏某些 DIV

Question

我收到了“新用户表单”。共有三种不同的间隙级别:

• 客户
• 客户联系方式
• 客户代表

还有一些字段，例如 newMail、newPostalCode 等。

这是我用来显示元素的代码:

function doShow(obj) {
                    document.getElementById(obj).style.display = '';
                }

以及我用来隐藏元素的代码:

function doHide(obj) {
                    document.getElementById(obj).style.display = 'none';
                }

它适用于小数据 block 。创建用户时，会指定许可级别，如果是 clientRepresentative，则会显示相应的字段。 例如，client 只有一个电子邮件地址，clientRepresentative 有两个电子邮件地址，clientContact 有三个电子邮件地址。

但这不起作用!。 如果我选择 client，则会有一封电子邮件，正如计划的那样，但如果我选择 clientContact，然后切换到 clientRepresentative，则冗余字段 (e-mail3) 不会被隐藏。

我相信这是一个 JavaScript 问题，请帮助我，因为我的愤怒程度已经达到极限。

编辑: 我忘记粘贴用于显示/隐藏项目的函数。

 if (clearenceLevel != "Chose...") {
                        if (clearenceLevel == "client") {

                            doShow("newMail");
                            doHide("newMail2");
                            doHide("newMail3");
                            doShow("newNip");
                            doShow("newRegon");
                            doShow("newStreet");
                            doHide("newHeadquarters");
                            doShow("newAddress");
                            doShow("newPostalCode");
                            doShow("kptekst");
                            doShow("newCity");
                            doShow("newAccount");
                            doShow("newState");
                            doHide("newStatus");
                            doHide("newPassword");
                        } else if (clearenceLevel == "clientRepresentative") {

                            doShow("newMail");
                            doShow("newMail2");
                            doHide("newStatus");
                            doHide("newMail3");
                            doHide("newNip");
                            doHide("newRegon");
                            doHide("newStreet");
                            doHide("newHeadquarters");
                            doHide("newAddress");
                            doHide("newPostalCode");
                            doHide("newCity");
                            doHide("newAccount");
                            doHide("newState");
                            doHide("kptekst");
                            doShow("newPassword");

                        } else if (clearenceLevel == "clientContact") {

                            doShow("newMail");
                            doShow("newMail2");
                            doShow("newMail3");
                            doHide("newNip");
                            doHide("newRegon");
                            doHide("newStatus");
                            doHide("newStreet");
                            doHide("newHeadquarters");
                            doHide("newAddress");
                            doHide("newPostalCode");
                            doHide("newCity");
                            doHide("newAccount");
                            doHide("newState");
                            doHide("kptekst");
                            doHide("newPassword");
                        }
                    }

Answer 1

不是对您的问题的直接回答，而是关于如何改进您的做法的建议。不必列出每个用户级别要显示和隐藏的每个属性，而是执行以下操作:

<input type="text" name="email" class="client representative contact">
<input type="text" name="ssn" class="representative">

然后，当用户级别更改时，隐藏所有内容，然后取消隐藏具有正确级别的所有内容。因此，在我的示例中，“电子邮件”可供“客户”、“代表”和“联系人”使用。因此，如果他们切换到任何级别，都会显示此字段，但“ssn”仅适用于“代表”，因此不会为其他任何人显示。

这样做的优点是能够轻松添加全新项目，无需修改 JavaScript，只需修改 HTML。

if (clearenceLevel != "Chose...") {
                    hideAll();
                    if (clearenceLevel == "client") {
                        doShow("client");
                    } else if (clearenceLevel == "clientRepresentative") {
                        doShow("representative");
                    } else if (clearenceLevel == "clientContact") {
                        doShow("contact");
                    }
 }