0

我的网页上有一个内联表单，加载页面时它被 css 隐藏。我还有一个按钮来显示表单。但是，如果再次单击它，我希望同一个按钮隐藏表单。但我似乎无法让它工作，相反，当我单击内联表单按钮时，即使我从未为其分配功能，表单也会消失。

这是我的 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 回答