자바스크립트를 사용하여 색상을 무작위로 변경할 수 있는 간단한 웹 계산기의 예-JS 튜토리얼-php.cn

자바스크립트를 사용하여 색상을 무작위로 변경할 수 있는 간단한 웹 계산기의 예

高洛峰

풀어 주다： 2017-01-20 17:17:15

원래의

1586명이 탐색했습니다.

이 기사의 예에서는 JavaScript로 무작위로 색상을 변경하는 간단한 웹 계산기를 구현하는 방법을 설명합니다. 참고할 수 있도록 모든 사람과 공유하세요. 자세한 내용은 다음과 같습니다.

이 프로그램은 간단한 덧셈, 뺄셈, 곱셈, 나눗셈 및 나머지를 구현할 수 있습니다. 이 페이지에는 색상을 무작위로 변경하는 기능도 추가되어 있습니다.

실행 효과 다이어그램은 다음과 같습니다.

자바스크립트를 사용하여 색상을 무작위로 변경할 수 있는 간단한 웹 계산기의 예

전체 예제 코드는 다음과 같습니다.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
 <TITLE> Day 2 </TITLE>
 <META NAME="Generator" CONTENT="EditPlus">
 <META NAME="Author" CONTENT="">
 <META NAME="Keywords" CONTENT="">
 <META NAME="Description" CONTENT="">
 <script>
  function calculator(){
    var selection=document.form.selection.value;
    var numb1=document.form.number1.value;
    var numb2=document.form.number2.value;
 var relnum="";
    switch(selection){
      case "+":
        relnum=parseFloat(numb1)+parseFloat(numb2);
  break;
      case &#39;-&#39;:
        relnum=numb1 - numb2;
        break;
      case &#39;*&#39;: 
        relnum=numb1 * numb2;
        break;
      case &#39;/&#39;:
        if(numb2==0)
          alert("wrong input! ");
        relnum=numb1 / numb2;
        break;
      case &#39;%&#39;:
        relnum=numb1 % numb2;
        break;
      }
  document.form.result.value=relnum;
  }
  function sound(){
    document.all.sound.src="clock.wav";
    }
  function changeBgcolor(){
    var bgc=document.getElementById("idbgc");
    var rand="";
    for(var i=0;i<6;i++){
    rand+=Math.round(Math.random()*9)
    }
    bgc.style.backgroundColor=&#39;#&#39;+rand;
  }  
  </script>
 </HEAD>
 <BODY bgcolor="aliceblue" id="idbgc">
  <h1>simple web calculator</h1>
  <form name="form" action=""> 
    <input type=text name="number1" style="width:80px ">
    <select name="selection">
      <option value=&#39;+&#39;> + <option>
      <option value=&#39;-&#39;>-<option>
      <option value=&#39;*&#39;>*<option>
      <option value=&#39;/&#39;>/<option>
      <option value=&#39;%&#39;>%<option>
    </select>
    <input type=text name="number2" style="width:80px ">
    <input type="button" value=" = " onclick="calculator(),changeBgcolor()">
    <input type=text name="result" style="width:80px "><br>
    <input type="reset" value="reset" onclick="changeBgcolor()">
  </form>
 </BODY>
</HTML>

로그인 후 복사

이 기사가 JavaScript 프로그래밍의 모든 사람에게 도움이 됩니다.

간단한 임의 색상 변경 웹 계산기 예제의 더 많은 자바스크립트 구현을 보려면 PHP 중국어 웹사이트에 주목하세요!