单击另一个时更改style.display的函数

时间:2017-11-04 18:39:54

标签: javascript php html

我是javascript的新手,从本网站上的一些代码开始,我正在尝试使用函数更改div的可见性。

功能是

var MyClass = document.getElementsByClassName("DivMainSH");
var myFunction = function() {
    var SenderId = this.id;
    var IdNums = SenderId.split("_");
    var SubDivId = 'DivSubSH_' + IdNums[1];
    var SubDiv = document.getElementById(SubDivId);
    if (SubDiv.style.display = 'none'){
        alert("I'm here"); // This works
        SubDiv.style.display = 'blok'; // this doesn't work
        document.getElementById(SubDivId).style.display = 'blok'; // this doesn't work
    }else{
        document.getElementById(SubDivId).style.display = 'none';
    }
};

for (var i = 0; i < MyClass.length; i++) {
    MyClass[i].addEventListener('click', myFunction, false);
}

代码有效,我看到警报,但隐藏的div仍然隐藏 我尝试了很多不同的方法,但没有人工作 我确定这是一个愚蠢的初学者错误但是我已经坚持这三天了。
修改
在错字修正之后,“其他”部分仍无法正常工作

我用来编写html的php代码如下:

$Des_N_Vals=array("FirstName"=>"FirstDescr", 
          "SecondName"=>"SecondDescr",
          "ThirdName"=>"ThirdDescr");
DivShowHide_Insert('Select options', $Des_N_Vals);
Function DivShowHide_Insert($Name, $Arr_NameVal_Descr){
    $Name=str_replace(' ', '_', $Name);
    $Num=0;
    foreach($Arr_NameVal_Descr as $Val => $Descr) {
        echo '<div class="DivMainSH" id="DivMainSH_'.$Num.'">
                  <h3>
                    <input type="checkbox" name="'.$Name.'['.$Num.']" ';
        if (isset($_POST[$Name][$Num]) && $_POST[$Name][$Num]==$Val) echo ' checked="checked" ';
                        echo 'value="'.$Val.'">'.$Val.'</input>
                  </h3>
                <div class="DivSubSH" id="DivSubSH_'.$Num.'" style="display:none;">
                    '.$Descr.'
                </div>
            </div>';
        $Num++;
    }
    echo '</div>';
}

1 个答案:

答案 0 :(得分:4)

你似乎有拼错'阻止'。

SubDiv.style.display = 'blok';
document.getElementById(SubDivId).style.display = 'blok';

将其更改为:

SubDiv.style.display = 'block';
document.getElementById(SubDivId).style.display = 'block';

而且,您实际上是在以下if语句中为SubDiv.style.display分配值:

if (SubDiv.style.display = 'none') {

这导致条件始终为真,因为赋值永远不会失败,因此div的显示样式始终为none,因此您的div最初被隐藏但永远不会回来。

if (SubDiv.style.display == 'none') {