时间戳

首页 > 解决方案 > .setAttribute 没有正确隐藏。HTML/CSS

html - .setAttribute 没有正确隐藏。HTML/CSS

问题描述

 function displayEditProfileStudent() {
        document,getElementById('editstudentprofile').setAttribute('class', 'unhide');
        document.getElementById('profile_viewStudent').setAttribute('class', 'hide');
        document.getElementById('ViewStudent').setAttribute('class', 'unhide');
    }
    function displayProfileViewStudent() {
        document,getElementById('editstudentprofile').setAttribute('class', 'hide');
        document.getElementById('profile_viewStudent').setAttribute('class', 'unhide');
        document.getElementById('ViewStudent').setAttribute('class', 'unhide');
    }

<div id="ViewStudent" class="hide">
            <a href="#ViewProfileStudent" class="student_profile_view col-sm-1" onclick= "displayProfileViewStudent()" >View Profile</a>
            <a href="#EditProfileStudent" class="student_profile_edit col-sm-1" onclick="displayEditProfileStudent()">Edit Profile</a>
            <form id="editstudentprofile" class="hide">
                <h4>Edit Profile</h4>
                <label class="col-sm-3">Major:</label>
                <input class="major_input col-sm-5" name="studentmajor" type="text" placeholder="Enter your Major">
                <br/>
                <label class="col-sm-3">Cumulative GPA:</label>
                <input class="GPA_input col-sm-1" name="studentGPA" type="text" placeholder="GPA">
                <br/>
                <label class="col-sm-3">Expected Graduation Date:</label>
                <input class="graduation_input col-sm-2" name="studentgraduationdate" type="text" placeholder="MM/DD/YYYY">
                <br/>
                <label class="col-sm-3">Have you served as a TA before?</label><br/>
                <input class="previousTA_input" name="previousTA" type="radio"> Yes<br/>
                <input class="previousTA_input" name="previousTA" type="radio"> No<br/>
                <a href="#EditProfileStudent" class="editaccount_btn btn btn-default" >Update Profile</a>
            </form>
            <div id="profile_viewStudent" class="hide">
                <h4>Profile</h4>
            </div>
        </div>

当我单击查看配置文件/编辑配置文件的链接时，它不会显示或隐藏另一个，我只看同一个屏幕。任何帮助表示赞赏，我已经尝试扫描其他帖子，据我所知，还没有任何帮助。

另外，这里是 hide 类的 CSS。

div.hide {
display: none;}

form.hide {
display: none;}

标签： htmlcss

解决方案

你可以试试

document.getElementById('editstudentprofile').classList.add('unhide');
document.getElementById('editstudentprofile').classList.remove('hide');

此外，在您的示例中，您在两行中使用 a,而不是 a .after 。document

推荐阅读