2016-10-07 1 views
1

JavaScript関数を呼び出そうとしていますが、currnetボタンのinnerHTMLを読み込み、ifステートメントを使用して、 。最初のクリックでは目的の変更が行われますが、2回目のクリックでは何も行われません。ブール式でコンテンツを代替するためにinnerHTMLを使用するifステートメントを使用すると、メソッドが正常に動作しない...

function signup() { 
 
    var test = document.getElementById('link-user').innerHTML; 
 

 
    if (test = 'Sign Up') { 
 
    document.getElementById('signup-name-first').style.display = 'block'; 
 
    document.getElementById('signup-name-last').style.display = 'block'; 
 
    document.getElementById('signup-email').style.display = 'block'; 
 
    document.getElementById('signup-password').style.display = 'block'; 
 
    document.getElementById('br1').style.display = 'block'; 
 
    document.getElementById('br2').style.display = 'block'; 
 
    document.getElementById('br3').style.display = 'block'; 
 
    document.getElementById('btn-sub').innerHTML = 'Sign Up'; 
 
    document.getElementById('link-user').innerHTML = 'Existing User'; 
 
    document.getElementById('link-forgot').style.display = 'none'; 
 
    } else { 
 
    document.getElementById('signup-name-first').style.display = 'none'; 
 
    document.getElementById('signup-name-last').style.display = 'none'; 
 
    document.getElementById('signup-email').style.display = 'none'; 
 
    document.getElementById('signup-password').style.display = 'none'; 
 
    document.getElementById('br1').style.display = 'none'; 
 
    document.getElementById('br2').style.display = 'none'; 
 
    document.getElementById('br3').style.display = 'none'; 
 
    document.getElementById('btn-sub').innerHTML = 'Log In'; 
 
    document.getElementById('link-user').innerHTML = 'Sign Up'; 
 
    document.getElementById('link-forgot').style.display = 'block'; 
 
    } 
 
}
<section id="win-login" class="win-login eds-win-pop eds-ani-popup"> 
 
    <form class=""> 
 
    <br /> 
 
    <input id="signup-name-first" type="text" placeholder="First Name" name="namefirst" class="input-txt eds-input-pop eds-ani-popup" /> 
 
    <br id="br1" class="eds-input-pop" /> 
 
    <input id="signup-name-last" type="text" placeholder="Last Name" name="namelast" class="input-txt eds-input-pop eds-ani-popup" /> 
 
    <br id="br2" class="eds-input-pop" /> 
 
    <input id="signup-email" type="text" placeholder="E-Mail Address" name="email" class="input-txt eds-input-pop eds-ani-popup" /> 
 
    <br id="br3" class="eds-input-pop" /> 
 
    <input type="text" placeholder="User Name" name="nameuser" class="input-txt" /> 
 
    <br /> 
 
    <br /> 
 
    <input type="password" placeholder="Password" name="password" class="input-txt" /> 
 
    <br /> 
 
    <br /> 
 
    <input id="signup-password" type="password" placeholder="Re-Enter Password" name="passwordconf" class="input-txt eds-input-pop eds-ani-popup" /> 
 
    <br /> 
 
    <button id="btn-sub" type="submit" class="btn-skyblu" action="">Login</button> 
 
    </form> 
 
    <br> 
 
    <a id="link-user" class="link-small" onclick="signup();">New User</a> 
 
    <br /> 
 
    <a id="link-forgot" class="link-small" onclick="pwreset();">Forgot Password</a> 
 
</section>

+0

私ミスタークリスすみません、あなたはjsFiddleをしてください提供できますか? –

+0

ミスター、asignment演算子 '='を使用して比較しています。これは '==' –

+1

です。申し訳ありませんが、それは何か分かりません。私はこのすべてにかなり新しいです。 編集: 私はjsfiddleが何であるかを理解しました。私は1つを作ります。 –

答えて

1

あなたの間違いは、この行である:

if (test = 'Sign Up') { 

あなたがの値にtestを割り当てることができる場合、これはされて言っています'Sign Up'、このコードをifステートメント内で実行します。

あなたが探しているのは、等しい値を確認する==演算子です。

if (test == 'Sign Up') { 

function signup() { 
 
    var test = document.getElementById('link-user').innerHTML; 
 

 
    if (test == 'Sign Up') { 
 
    document.getElementById('signup-name-first').style.display = 'block'; 
 
    document.getElementById('signup-name-last').style.display = 'block'; 
 
    document.getElementById('signup-email').style.display = 'block'; 
 
    document.getElementById('signup-password').style.display = 'block'; 
 
    document.getElementById('br1').style.display = 'block'; 
 
    document.getElementById('br2').style.display = 'block'; 
 
    document.getElementById('br3').style.display = 'block'; 
 
    document.getElementById('btn-sub').innerHTML = 'Sign Up'; 
 
    document.getElementById('link-user').innerHTML = 'Existing User'; 
 
    document.getElementById('link-forgot').style.display = 'none'; 
 
    } else { 
 
    document.getElementById('signup-name-first').style.display = 'none'; 
 
    document.getElementById('signup-name-last').style.display = 'none'; 
 
    document.getElementById('signup-email').style.display = 'none'; 
 
    document.getElementById('signup-password').style.display = 'none'; 
 
    document.getElementById('br1').style.display = 'none'; 
 
    document.getElementById('br2').style.display = 'none'; 
 
    document.getElementById('br3').style.display = 'none'; 
 
    document.getElementById('btn-sub').innerHTML = 'Log In'; 
 
    document.getElementById('link-user').innerHTML = 'Sign Up'; 
 
    document.getElementById('link-forgot').style.display = 'block'; 
 
    } 
 
}
<section id="win-login" class="win-login eds-win-pop eds-ani-popup"> 
 
    <form class=""> 
 
    <br /> 
 
    <input id="signup-name-first" type="text" placeholder="First Name" name="namefirst" class="input-txt eds-input-pop eds-ani-popup" /> 
 
    <br id="br1" class="eds-input-pop" /> 
 
    <input id="signup-name-last" type="text" placeholder="Last Name" name="namelast" class="input-txt eds-input-pop eds-ani-popup" /> 
 
    <br id="br2" class="eds-input-pop" /> 
 
    <input id="signup-email" type="text" placeholder="E-Mail Address" name="email" class="input-txt eds-input-pop eds-ani-popup" /> 
 
    <br id="br3" class="eds-input-pop" /> 
 
    <input type="text" placeholder="User Name" name="nameuser" class="input-txt" /> 
 
    <br /> 
 
    <br /> 
 
    <input type="password" placeholder="Password" name="password" class="input-txt" /> 
 
    <br /> 
 
    <br /> 
 
    <input id="signup-password" type="password" placeholder="Re-Enter Password" name="passwordconf" class="input-txt eds-input-pop eds-ani-popup" /> 
 
    <br /> 
 
    <button id="btn-sub" type="submit" class="btn-skyblu" action="">Login</button> 
 
    </form> 
 
    <br> 
 
    <a id="link-user" class="link-small" onclick="signup();">New User</a> 
 
    <br /> 
 
    <a id="link-forgot" class="link-small" onclick="pwreset();">Forgot Password</a> 
 
</section>

+0

ロングバージョンありがとうございます!非常に有益。私のノギングのクリックを助けました。今私は=と==の違いを得ます。 –

3

==ない=を使用しています。比較演算子の詳細情報については

if (test == 'Sign Up') { 
    //your code 
} 

:このよう http://www.w3schools.com/js/js_comparisons.asp

+0

このような簡単な答え!感謝!完璧に動作します。 –

関連する問題