예전에 잠시 알았던 저항값을 다시 보려니 찾기도 힘들고 눈이 침침해져 값 읽어내기도 힘들고 결정적으로 계산식이 너무 힘들어 그냥 웹에서 간단하게 알아보는 HTML코드를 만들어 봤다.
만드는김에 JQuery를 이용해봤는데 대충 되는거 같다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="Author" content="codebank">
<title>저항값 보기</title>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<style type="text/css">
body
{
background-color: #cccccc;
font-family: "Noto Sans CJK KR";
Color: #000088;
}
</style>
<script type="text/javascript">
$.fn.compute = function () {
var number = $('#color_count').val ();
var color1 = parseFloat ($('#color1').val ());
var color2 = parseFloat ($('#color2').val ());
var color3 = parseFloat ($('#color3').val ());
var color4 = $('#color4').val ();
var color5 = $('#color5').val ();
var color6 = $('#color6').val ();
var str = "";
if (number === '4')
{
var res = (color1 * 10 + color2) * color4;
if (res >= 1000000)
{
res /= 1000000;
str = res + "MΩ " + color5;
}
else if (res >= 1000)
{
res /= 1000;
str = res + "KΩ " + color5;
}
else
{
str = res + "Ω " + color5;
}
}
else if (number === '5')
{
var res = (color1 * 100 + color2 * 10 + color3) * color4;
if (res >= 1000000)
{
res /= 1000000;
str = res + "MΩ " + color5;
}
else if (res >= 1000)
{
res /= 1000;
str = res + "KΩ " + color5;
}
else
{
str = res + "Ω " + color5;
}
}
else if (number === '6')
{
var res = (color1 * 100 + color2 * 10 + color3) * color4;
if (res >= 1000000)
{
res /= 1000000;
str = res + "MΩ " + color5 + " " + color6;
}
else if (res >= 1000)
{
res /= 1000;
str = res + "KΩ " + color5 + " " + color6;
}
else
{
str = res + "Ω " + color5 + " " + color6;
}
}
str = "결과 : " + str;
$("#result").text(str);
};
$(document).ready(function() {
$('#color_count').change(function() {
var value = $(this).val();
if (value === '4')
{
$("div").find("#color3").each(function() {
$(this).attr('style','visibility:hidden');
})
$("div").find("#color6").each(function() {
$(this).attr('style','visibility:hidden');
})
}
else if (value === '5')
{
$("div").find("#color3").each(function() {
$(this).attr('style','visibility:visible');
})
$("div").find("#color6").each(function() {
$(this).attr('style','visibility:hidden');
})
}
else if (value ==='6')
{
$("div").find("#color3").each(function() {
$(this).attr('style','visibility:visible');
})
$("div").find("#color6").each(function() {
$(this).attr('style','visibility:visible');
})
}
$("#calcurator").compute ();
});
$("#color1").change(function() {
$("#calcurator").compute ();
});
$("#color2").change(function() {
$("#calcurator").compute ();
});
$("#color3").change(function() {
$("#calcurator").compute ();
});
$("#color4").change(function() {
$("#calcurator").compute ();
});
$("#color5").change(function() {
$("#calcurator").compute ();
});
$("#color6").change(function() {
$("#calcurator").compute ();
});
});
</script>
</head>
<body>
<H1>저항값 보기</H1>
<div id="calcurator">
색띠 개수 :
<select name="color_count" id="color_count">
<option value="4" selected>4</option>
<option value="5">5</option>
<option value="6">6</option>
</select>
<br />
<br />
<select name="color1" id="color1">
<option value="0">검정</option>
<option value="1">갈색</option>
<option value="2">빨강</option>
<option value="3">주황</option>
<option value="4">노랑</option>
<option value="5">초록</option>
<option value="6">파랑</option>
<option value="7">보라</option>
<option value="8">회색</option>
<option value="9">하양</option>
</select>
<select name="color2" id="color2">
<option value="0">검정</option>
<option value="1">갈색</option>
<option value="2">빨강</option>
<option value="3">주황</option>
<option value="4">노랑</option>
<option value="5">초록</option>
<option value="6">파랑</option>
<option value="7">보라</option>
<option value="8">회색</option>
<option value="9">하양</option>
</select>
<select name="color3" id="color3" style="visibility:hidden">
<option value="0">검정</option>
<option value="1">갈색</option>
<option value="2">빨강</option>
<option value="3">주황</option>
<option value="4">노랑</option>
<option value="5">초록</option>
<option value="6">파랑</option>
<option value="7">보라</option>
<option value="8">회색</option>
<option value="9">하양</option>
</select>
<select name="color4" id="color4">
<option value="0.01">은색</option>
<option value="0.1">금색</option>
<option value="1">검정</option>
<option value="10">갈색</option>
<option value="100">빨강</option>
<option value="1000">주황</option>
<option value="10000">노랑</option>
<option value="100000">초록</option>
<option value="1000000">파랑</option>
<option value="10000000">보라</option>
</select>
<select name="color5" id="color5">
<option value="±10%">은색</option>
<option value="±5%">금색</option>
<option value="±1%">갈색</option>
<option value="±2%">빨강</option>
<option value="±0.5%">초록</option>
<option value="±0.25%">파랑</option>
<option value="±0.1%">보라</option>
</select>
<select name="color6" id="color6" style="visibility:hidden">
<option value="100ppm">갈색</option>
<option value="50ppm">빨강</option>
<option value="15ppm">주황</option>
<option value="25ppm">노랑</option>
</select>
<br />
<br />
<h1><p id="result">결과 : </p></h1>
</div>
</body>
</html>
참고한 사이트는
http://hodorii.blogspot.com/2012/06/456.html
4,5,6 띠 저항의 색띠를 읽는 법(띠저항 값)
4색 : 2번띠까지 값, 3번띠 승수, 4번띠 오차 5색 : 3번띠까지 값, 4번띠 승수, 5번띠 오차 6색 : 3번띠까지 값, 4번띠 승수, 5번띠 오차, 6번띠 온도계수 발췌(http://blog...
hodorii.blogspot.com
이며 색띠의 값과 의미에 대한 설명이 자세히 되어있다.
결과 확인은 RaspberryPI에 아파치를 설치해서 확인해봤지만 다른 곳에서도 문제없이 동작할 것으로 생각된다.
'컴퓨터' 카테고리의 다른 글
| node.js에서 java 호출하기 (0) | 2022.03.15 |
|---|---|
| MacOS FileZilla 대기파일 삭제 (0) | 2022.01.12 |
| XPlanet의 추억 (1) | 2019.04.06 |
| git 서버 (0) | 2018.03.23 |
| MicroSD 쓰기 방지에 대하여 (0) | 2018.02.23 |
