javascript - 隐藏/显示元素

Question

我得到了这个功能，通过点击按钮“+显示更多”或“-隐藏”来显示和隐藏容器，具体取决于当前操作。但是它不起作用。对原因有何见解？

echo '  <br>
        <a href="employees.php" style="display:inline-block;"><img src="../img/back.png" /></a><br>
        <button type="button" onclick="show_hide("pinfocontainer","hidepinfo");" class="sidebutton" id="hidepinfo">+ Show more</button>

    <div class="hide" id="pinfocontainer">

        <div class="editform">
        <h1>Personal Info </h1>
        <br>
        <form action="" method="post">
            <span></span>';

            $sql = "SHOW COLUMNS FROM candidates";
            $result = mysqli_query($con,$sql);
            while($row = mysqli_fetch_array($result)){
                $sql2 = "SELECT ".$row['Field']." FROM candidates WHERE ID='".$_GET["cid"]."'";
                $result2 = mysqli_query($con,$sql2);
                echo '<label class="editlabel"> '.$row['Field'].' : </label>';
                while($row2 = mysqli_fetch_array($result2)){
                    echo '<input class="editinput" id="'.$row['Field'].'" name="'.$row['Field'].'" value="'.$row2[$row['Field']].'" type="text">';
                }
                echo '<br>';
            }

echo       '<input name="submit" type="submit" value=" Update " style="width:105%;">
            <span></span>
        </form>
        </div>
    </div>

    <div style="display:inline-block;padding-left:15px;padding-right:15px;"> </div>

功能:

function show_hide(id, id2) {
    var e = document.getElementById(id);

    if(e.style.display == 'inline-block') {
        e.style.display = 'none';
        document.getElementById(id2).innerHTML = "+ Show More";
    }
    else {
        e.style.display = 'inline-block';
        document.getElementById(id2).innerHTML = "- Hide";
    }
}

Answer 1

onclick="show_hide("pinfocontainer","hidepinfo");"

您用第二个 "关闭属性，因此将 "更改为 '

onclick="show_hide('pinfocontainer','hidepinfo');"

你可以逃避 ' 因为你回应了它

echo 'onclick="show_hide(\'pinfocontainer\',\'hidepinfo\');"';