如果另一個使用Javascript打開，則需要關閉div

基本上我已經註冊並登錄，而且它們都是在鏈接的點擊時出現和消失的div，但是我希望一個關閉，如果另一個被點擊，然後打開。如果另一個使用Javascript打開，則需要關閉div

示例：登錄區域已打開，並且單擊了註冊按鈕。我希望登錄區域消失，並註冊內容。

目前代碼：

<script language="javascript"> 
function toggle() { 
    var ele = document.getElementById("signin"); 
    var text = document.getElementById("signtext"); 
    var ele2 = document.getElementById("signup"); 
    var text2 = document.getElementById("signuptext"); 
    if(ele.style.display == "block") { 
     ele.style.display = "none"; 
     text.innerHTML = "show"; 
     ele2.style.display = "block"; 
     text2.innerHTML = "hide"; 
    } 
    else { 
     ele.style.display = "block"; 
     text.innerHTML = "hide"; 
     ele2.style.display = "block"; 
     text2.innerHTML = "hide"; 
    } 
} 
function toggle2() { 
    var ele2 = document.getElementById("signup"); 
    var text2 = document.getElementById("signuptext"); 
    var ele = document.getElementById("signin"); 
    var text = document.getElementById("signtext"); 
    if(ele2.style.display == "block") { 
     ele2.style.display = "none"; 
     text2.innerHTML = "show"; 
     ele.style.display = "block"; 
     text.innerHTML = "hide"; 
    } 
    else { 
     ele2.style.display = "block"; 
     text2.innerHTML = "hide"; 
     ele.style.display = "block"; 
     text.innerHTML = "hide"; 
    } 
} 
</script>

HTML：

<div id="signin" style="display: none"> 
<form action="loginscript.php" method="post"> 
<p>Username:<input type="text" id="username"></p> 
<p>Password:<input type="password" id="password"> <input type="submit" value="submit"></p> 
</form> 
</div> 
<div id="signup" style="display: none"> 
<h1>peek-a-boo</h1> 
</div>

來源

2013-06-21 connormcwood

使用'

您可以在「點擊」事件調用一個函數，並使用CSS:Visibility財產

<a id="myLink" href="#" onclick="MyFunction();">link text</a>

來源

2013-06-21 04:15:39

嘗試this.There無需創建兩個不同functions.Lesser的功能數量的隱藏在div =更好的代碼+更聰明的是編碼器！

function toggle(id){ 

switch(id) 
{ 
case 'signin': 
document.getElementById('signin').style.display='block'; 
document.getElementById('signup').style.display='none'; 
break; 

case 'signup': 
document.getElementById('signup').style.display='block'; 
document.getElementById('signin').style.display='none'; 
break; 
}

HTML

<div id="signin" onclick="toggle(this.id)"> SignIN</div> 
<div id="signup" onclick="toggle(this.id)"> SignUp</div>

來源

2013-06-21 04:20:52

MESSIAH，它是不工作在小提琴...... – user

@用戶：這只是基本的想法，你想要的功能的邏輯。你必須推動自己一點，並相應地操縱你的代碼!!!這是完美的根據我。給我你的小提琴鏈接。 –

嘗試從這個搶的概念，可能不是完美的，但仍含有一些學習部 -

檢查該工作小提琴 - http://jsfiddle.net/j7LDD/

工作代碼 -

HTML部分 -

<form id="signup" method="get" style="display:none;"> 
<label>SignUp Name</label> 
<input type="text" name="signupname" /> 
<input type="submit" name="signupsubmit" value="signup" /> 
</form> 

<form id="signin" method="get" style="display:none;"> 
<label>SignIn Name</label> 
<input type="text" name="signinname" /> 
<input type="submit" name="signinsubmit" value="signin" /> 
</form> 

<button id="signupbutton" onclick="toggle(this.id);">SignUp</button> 
<button id="signinbutton" onclick="toggle(this.id);">SignIn</button>

JS PART -

<script> 
function toggle(val) { 
    if("signupbutton" == val) { 
    document.getElementById("signup").style.display = 'block'; 
    document.getElementById("signin").style.display = 'none'; 
    } 
    else { 
    document.getElementById("signin").style.display = 'block'; 
    document.getElementById("signup").style.display = 'none'; 
    } 
} 
</script>

來源

2013-06-21 04:39:17 swapnesh

相關問題