2013-11-02 36 views
0

我一直試圖讓這個工作,並認爲它會相對容易,但我只是無法針對我的div與JavaScript。用Javascript更改顯示div

我想要一個盒子列表,每個盒子都是可點擊的,每個盒子都有一個隱藏的好友。當你點擊一個,它隱藏並顯示它的好友,它將有一個輸入框。輸入您需要的文本,然後按確定,它會變回原來的狀態,顯示您輸入的文本。

頭包含以下內容:

<head> 
<script language="javascript"> 
var state = 'none'; 

function showhide(layer_ref) { 

if (state == 'block') { 
state = 'none'; 
} 
else { 
state = 'block'; 
} 
if (document.all) { //IS IE 4 or 5 (or 6 beta) 
eval("document.all." + layer_ref + ".style.display = state"); 
} 
if (document.layers) { //IS NETSCAPE 4 or below 
document.layers[layer_ref].display = state; 
} 
if (document.getElementById &&!document.all) { 
hza = document.getElementById(layer_ref); 
hza.style.display = state; 
} 

} 
</script> 

然後我的HTML包含:

<div id="div0"> 
<a href="#" onclick="showhide('div1');" style="text-decoration:none;"> 
    <div style="width:200px; height:30px; background-color:grey;color:white"> 
    Input: <div id="showinput"></div> 
    </div> 
</a> 
</div> 

<div id="div1" style="display:none;"> 
<div style="width:200px; height:30px; background-color:grey;color:white"> 
    <input type="text id="addInput" /"> 
    <input type="submit" value="submit" name="submit" onclick="showhide('div1');" /> 
</div> 
</div> 

我試圖添加以下,但它只是不會更新原始和腳本只是讓好友div顯示在原始的下方。我怎樣才能同時隱藏原件?

var myobj = document.getElementById("addInput"); 
var mytext = myobj.value; 
document.getElementById("showinput").innerHTML = mytext; 
+1

您將您的問題標記爲「jquery」,那麼爲什麼不使用它?我的意思是$('#div1')。hide();工作得很好。 搜索「jquery hide示例」 –

回答

0

您錯過了關於type="text的收盤價,因此未設置輸入ID。嘗試:

<input type="text" id="addInput" />