HTML / CSS / Javascript函数创建

时间:2018-09-09 18:07:14

标签: javascript html css

我正在建立一个可以转换您的电话号码的网站。我已经有了大部分代码,我只是遇到一个错误,无法弄清楚。当我运行它时,页面上会有代码,当我单击按钮时,它不会运行。

<div id = "conversion">
function feet() {
  var userinches = document.getElementById('userinches').value;
  doOuput('The answer is', userinches / 0.0833, ' ft');
}

function doOuput(val, unit) {
  //console.log('Convert To ' + unit);
  document.getElementById('results').innerHTML = val + unit;
}
</div><!-- End of conversion div section -->

2 个答案:

答案 0 :(得分:1)

您需要将javascript放在script标记中。最好将它们与html文件完全分开,并将其写入单独的js文件中。在html中包含该js文件

<div id="question">
  <h2>Unit Convertor</h2>
  <img src="" alt="Picture of basketball">
  <p>Enter a Quanity of Inches: <input id="userinches" type="number" /> </p>
</div>

<div id="conversion">
  <script>
    function feet() {
      var userinches = document.getElementById('userinches').value;
      doOuput('The answer is', userinches / 0.0833, ' ft');
    }

    function cm() {
      var userinches = document.getElementById('userinches').value;
      doOuput('The answer is', userinches * 2.54, ' cm');
    }

    function yards() {
      var userinches = document.getElementById('userinches').value;
      doOuput('The answer is', userinches / 0.02778, ' yard');
    }

    function doOuput(val, unit) {
      //console.log('Convert To ' + unit);
      document.getElementById('results').innerHTML = val + unit;
    }
  </script>
</div>

<div="buttons">
  <button type="button" onclick="feet();">Feet</button>
  <button type="button" onclick="cm();">Centimeters</button>
  <button type="button" onclick="yards();">Yards</button>
  </div>
  <!-- End of buttons div section -->

  <div id="results"></div>

答案 1 :(得分:0)

您必须在<script>标签之间使用Javascript。 请考虑使用类似

的外部文件
<script src="myscripts.js"></script>