2017-01-25 6 views
1

zurück Während document.getElementById unter Verwendung der Variablen aufgerufen wird, gibt es null zurück. Unten ist der Code Beispiel:Die Übergabe der Variable in document.getElementById gibt Null

function savenext(k) 
 
{ 
 
    qdd=k.id; 
 
    var divs = document.getElementsByClassName("qpanel"); 
 
    for(var i=0;i<divs.length;i++) 
 
    { 
 
    divs[i].style.display = "none"; 
 
    } 
 
    str = qdd.replace(/SN/g, ''); 
 
    str='Q'+str; 
 
    var d = document.getElementById(str); 
 
    d.style.display = "block"; 
 
}
<div id="main" class="qpanel" id="Q3"> 
 
    \t Q3 
 
    </div> 
 
    
 
    <div id="main" class="qpanel" id="Q2"> 
 
    \t Q2 
 
    </div> 
 
    
 
    <div id="main" class="qpanel" id="Q6"> 
 
    \t Q6 
 
    </div> 
 
    
 
    <input type="button" value="Save and next" id="SN3" onclick="savenext(this)" class="savenext"> 
 
    <input type="button" value="Save and next" id="SN2" onclick="savenext(this)" class="savenext"> 
 
    <input type="button" value="Save and next" id="SN6" onclick="savenext(this)" class="savenext">

document.getElementById(str) gibt null zurück

+0

'ID's innerhalb des Dokuments eindeutig sein muss. Beachte die doppelten 'id's in den divs. Wenn die Seite geparst wird, wird die zweite ID ignoriert. – Teemu

+4

@Teemu tatsächlich haben die Divs zwei ID-Attribute. Das ist in html nicht erlaubt. – Esko

Antwort

1

Dies ist die Arbeitslösung. du hast dem div zwei ids gegeben

<script > 

function savenext(k) 
{ 
    qdd=k.id; 
    divs = document.getElementsByClassName("qpanel"); 
    for(var i=0;i<divs.length;i++) 
    {  
    console.log(divs[i]) 
     divs[i].style.display = "none"; 
    } 
    str = qdd.replace(/SN/g, ''); 
    str='Q'+str; 
    var d = document.getElementById(str); 
    console.log(str) 
    d.style.display = "block"; 
} 


</script> 
<div class="qpanel" id="Q3"> 
    Q3 
</div> 

<div class="qpanel" id="Q2"> 
    Q2 
</div> 

<div class="qpanel" id="Q6"> 
    Q6 
</div> 

<input type="button" value="Save and next" id="SN3" onclick="savenext(this)" class="savenext"> 
<input type="button" value="Save and next" id="SN2" onclick="savenext(this)" class="savenext"> 
<input type="button" value="Save and next" id="SN6" onclick="savenext(this)" class="savenext"> 
0

Zwei Dinge müssen beachtet werden.

* Jeder Artikel sollte nur eine ID haben. hier bekam jedes div eine id main und eine andere id Q3. * ID sollte eindeutig, aber nicht erforderlich sein.

geht hier, um den Arbeitscode

<!doctype html> 
<html> 
<body> 
<div class="qpanel" id="Q3"> 
    Q3 
</div> 

<div class="qpanel" id="Q2"> 
    Q2 
</div> 

<div class="qpanel" id="Q6"> 
    Q6 
</div> 

<input type="button" value="Save and next" id="SN3" onclick="savenext(this)" class="savenext"> 
<input type="button" value="Save and next" id="SN2" onclick="savenext(this)" class="savenext"> 
<input type="button" value="Save and next" id="SN6" onclick="savenext(this)" class="savenext"> 
<script> 
function savenext(k) 
{ 
    qdd=k.id; 
    var divs = document.getElementsByClassName("qpanel"); 
    for(var i=0;i<divs.length;i++) 
    { 
     divs[i].style.display = "none"; 
    } 
    str = qdd.replace(/SN/g, ''); 
    str='Q'+str; 
    var d = document.getElementById(str); 
    d.style.display = "block"; 
} 

</script> 
</body> 
</html> 
Verwandte Themen