dounianluo0086
2017-11-04 18:39
浏览 190
已采纳

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

I'm new to javascript and, starting from some code found on this site, I'm trying to change the visibility of a div using a function.

The function is

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);
}

The code works and I see the alert but the hidden div remains hidden.
I've tried many different approaches but no one worked.
I'm sure it's some stupid beginner mistake but I'm stuck with this since three days.
EDIT
The "else" part still not working after the typo correction

The php code I'm using to write the html is the following:

$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条回答 默认 最新

  • dtdvlazd56637 2017-11-04 18:41
    已采纳

    You seem to have misspelt 'block'.

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

    Change this to:

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

    And also, you are actually assigning a value to SubDiv.style.display in your following if statement:

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

    This is causing the condition to always be true since the assignment never fails and so the display style of the div is always none, hence your div initially being hidden but never coming back.

    if (SubDiv.style.display == 'none') {
    
    已采纳该答案
    评论
    解决 无用
    打赏 举报

相关推荐 更多相似问题