傳遞document.getElementById中的變量將返回Null

使用變量調用document.getElementById時，它將返回空值。下面是示例代碼：傳遞document.getElementById中的變量將返回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)返回null

來源

2017-01-25 erdeepak

'id's必須是文檔中是唯一的。請注意div中的double id。當頁面被解析時，第二個id將被忽略。 – Teemu

@Teemu實際上divs有兩個id屬性。這是不允許在HTML中。 – Esko

這是可行的解決方案。你給了這個div兩個ID

<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">

來源

2017-01-25 11:18:04

需要注意兩點。

*每個項目只能有一個ID。這裏每個div都有一個id主鍵和另一個id Q3。 * ID應該是唯一的，但不是必需的。

這裏去工作代碼

<!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>

來源

2017-01-25 11:19:46 Santosh

傳遞document.getElementById中的變量將返回Null

回答

相關問題