【问题标题】:What am I doing incorrectly?我做错了什么?
【发布时间】:2011-06-01 11:09:29
【问题描述】:

实时代码:http://jsfiddle.net/vy4nY/

我正在关注this challenge,但我遇到了一些问题。我试图使电子邮件地址框仅在单击复选框时出现。我做错了什么?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
  <head>
    <title>JavaScript Challenges</title>
    <style type="text/css">
    #emailpara {visibility:hidden;}
    </style>
  </head>
  <body>
    <form action="">
      <fieldset>

        <legend>Email subscriptions</legend>

        <p id="subscribepara">
          <label>
            <input type="checkbox" name="subscribe" id="subscribe">
            Yes! I would like to receive the occasional newsletter via email.
          </label>
        </p>

        <p id="emailpara">
          <label>
            Email Address:
            <input type="text" name="email" id="email">
          </label>
        </p>

      </fieldset>
    </form>
      <script type="text/javascript">
document.getElementById('subscribe').onclick = (document.getElementById('subscribe').checked ? (document.getElementById('emailpara').style.visibility = 'visible') : (document.getElementById('emailpara').style.visibility = 'hidden'));
      </script>
  </body>
</html>

【问题讨论】:

    标签: javascript checkbox onclick


    【解决方案1】:

    你需要把它作为函数:

    document.getElementById('subscribe').onclick = function() {
              document.getElementById('subscribe').checked ?  document.getElementById('emailpara').style.visibility = 'visible' : document.getElementById('emailpara').style.visibility = 'hidden';
              }
    

    更新的 jsFiddle:http://jsfiddle.net/yahavbr/vy4nY/1/

    【讨论】:

      【解决方案2】:

      onclick 处理程序应该是一个函数。使用:

      document.getElementById('subscribe').onclick = function() {
          document.getElementById('emailpara').style.visibility = this.checked ? 'visible' : 'hidden';
      }
      

      【讨论】:

      • 该死!快了 3 秒,而且您有时间改进代码.. :-)
      • 嘿,我知道那种感觉......他们应该有一个蜂鸣器,就像那些游戏节目一样:)
      猜你喜欢
      • 1970-01-01
      • 2021-04-14
      • 2021-04-19
      • 2017-03-13
      • 2017-01-18
      • 2013-06-24
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多