-3

私はそれを持っていて、それdivを隠しspanています。ボタンクリックで見せたいです。私のコード：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>register page</title>
    <link rel="stylesheet" href="/static/css/bootstrap.min.css">
    <script type="text/javascript" src="/static/js/test.js"></script>
  </head>
  <body>
    <form id="register-form">           
        <label>Username<span id="register-username-label" class="label label-important" style="visibility: hidden;">Username can't be empty</span></label>
        <input id="register-username-input" type="text" placeholder="Type username..."/>
        <button id="register-submit" onclick="show_element('register-username-label')" class="btn">Register</button>
        </form>
    </div>
  </body>
</html>

そして私のjsファイル：

function show_element (id) {
    document.getElementById(id).style.visibility = 'visible';
}

iボタンをクリックするとスパンが表示されません。なんで？それは非常に速く表示され、再び隠されます。

Chromeデベロッパーツールコンソールにもエラーは表示されません。

ありがとうございました。

4

3 に答える 3

2

return falseボタンのonClick（）イベントに追加してみてください。このような：

<button id="register-submit" onclick="show_element('register-username-label'); return false;" class="btn">Register</button>
于 2013-03-20T10:47:42.443 に答える
1

関数を最初に呼び出す前に、関数を定義する必要があります。head通常、これは、HTMLの内部にネストされたスクリプトタグ内に関数コードを配置することで実現できます。

このような：

<head>
  <script type="text/javascript">
    function show_element (id) {
      document.getElementById(id).style.visibility = 'visible';
    }
  </script>
</head>
于 2013-03-20T10:16:43.977 に答える
-1

申し訳ありませんが、このコードは機能します：

    <html>

    <head>

    <script>
    function show_element (id) {
        document.getElementById(id).style.visibility = 'visible';
    }
    </script>
    </head>
    <body>
    <div>
    <span id="register-username-label" class="label label-important" style="visibility: hidden">Username can't be empty</span>
      <button id="register-submit" onclick="show_element('register-username-label')" class="btn">Register</button>
    </div>

    </body>
    </html>

編集

私はあなたの編集を読みました。ところで、私はあなたの絶対的な道が問題を引き起こすかもしれないと思います。

このコードを試してください：

    <!DOCTYPE html>
    <html>
      <head>
        <meta charset="utf-8" />
        <title>register page</title>
        <link rel="stylesheet" href="./static/css/bootstrap.min.css">
        <script type="text/javascript" src="./static/js/test.js"></script>
      </head>
      <body>
        <form id="register-form">           
            <label>Username<span id="register-username-label" class="label label-important" style="visibility: hidden;">Username can't be empty</span></label>
            <input id="register-username-input" type="text" placeholder="Type username..."/>
            <button id="register-submit" onclick="show_element('register-username-label')" class="btn">Register</button>
            </form>
        </div>
      </body>
    </html>
于 2013-03-20T10:15:36.960 に答える