0

ページの読み込み時に css によって非表示になるインライン フォームが Web ページにあります。フォームを表示するボタンもあります。ただし、同じボタンをもう一度クリックするとフォームが非表示になるようにします。しかし、インラインフォームボタンをクリックすると、機能を割り当てていなくてもフォームが消えてしまいます。

ここに私のHTMLがあります

<button id="signup" onclick="showForm('inline')">SignUp!</button>

        <!-- hidden inline form -->
        <div id="inline">
        <h2>Register! It's free!</h2>
        <form id="register" action="#" method="post" name="register">
        <label for="email">Email:</label>
            <input id="email" class="txt" type="email" name="email" />

        <label for="password">Password:</label>
            <input id="password" class="passtxt" type="password" name="password" />

        <label for="password">Repeat Password:</label>
            <input id="password" class="passtxt" type="password" name="password" />

        <button id="registerbtn">Register</button>
        </form> 
        </div>

ここに私のJSがあります：

function showForm(form) {

    var e = document.getElementById(form);

    if (e.style.display = 'none') 
        e.style.display = 'inline';
    else
    e.style.display = 'none';

}

サインアップボタンをクリックすると、フォームが表示されます。しかし、もう一度クリックしても何も起こりません。しかし、フォームの登録ボタンをクリックすると消えてしまいます。なんで？どうすれば修正できますか？

編集：私が探していたものだったので、DaveHogan'sを最良の答えとして選びました。しかし、代わりに JQuery を使用するように切り替えました。あなたも切り替えるべし。

4

3 に答える 3

4

等価性を正しくチェックしていないようです (二重等価を使用してください)。

if (e.style.display == 'none')
于 2012-08-02T14:15:58.047 に答える
3

jQueryを使用する場合は、トグルを使用できます:)

http://jsfiddle.net/Se5bm/

<div id="foo">omg </div>
<button id="bar">toggle me</button>​

$('#bar').bind('click' , function() {
    $('#foo').toggle();
});
​
于 2012-08-02T14:16:21.650 に答える
0

「=」は「==」と同じではないことを覚えておく必要があります。= は割り当て、== は質問用です。このようなものです... A = B、この場合、A が等しいことを割り当てますB、A == B と書くと、A が B と等しいかどうかを尋ねています。

于 2012-08-02T14:21:30.643 に答える