자바스크립트 질문입니다. 정보
자바스크립트 질문입니다.
본문
어떻게 하다보니, 자바스크립트로 계산기를 만들게 되었습니다.
사실 자바스크립트 해본적은 없는데, 일이 생겨서 검색이나 질문을 통해
어찌어찌해서 만들었는데요.
이게 또 문제가 생겨서 도대체 답이 안나와서 이렇게 질문을 올립니다 ^^;;
쇼핑몰에 이용되는 간단한 계산기 인데요. 롤스크린 혹은 벽지를 판매하는 곳입니다.
원리는 원단값과 가로 세로 사이즈를 이용하여 가격을 산출하는 계산기 입니다.
원단가격이 28,000원이라고 했을때, 가로 * 세로 값이 100 * 100일경우 기본 가격이 나옵니다.
문제는 가로 * 세로값을 100 * 100 이하로 입력을 하면 기본가격 이하로 나오더라구요...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr" />
<title>Untitled Document</title>
</head>
<script language="javascript">
function goTest() {
//var onedan = '20000'; // 임의의 원단가격
var fm = document.testForm;
if(fm.onedan.value == '') {
alert("원단가격을 선택해주세요");
fm.cnt.focus();
return;
}
if(fm.xSize.value == '') {
alert("가로사이즈를 입력해주세요");
fm.xSize.focus();
return;
}
if(fm.ySize.value == '') {
alert("세로사이즈를 입력해주세요");
fm.ySize.focus();
return;
}
price_t = (fm.xSize.value * fm.ySize.value)*0.0001;
number_t = (fm.xSize.value) * (fm.ySize.value) * fm.onedan.value*0.0000001;
price_t1 = (fm.xSize.value) * (fm.ySize.value) * fm.onedan.value*0.0000001;
if (price_t1*1000 < fm.onedan.value) {
price_t1 == fm.onedan.value;
}
document.getElementById("price2").value = price_t;
document.getElementById("number").value = Math.round(number_t).toFixed(0);
document.getElementById("price1").value = Math.round(price_t1).toFixed(0)*1000;
}
</script>
<body>
<table width="740" border="0" cellspacing="0" cellpadding="0" align="center"><form name="testForm" method="post" >
<tr>
<td height="30"></td></tr>
<tr>
<td colspan="2"><img src="http://pul7com.godohosting.com/pul7com/open/cal_dot.gif" /></td>
</tr>
<tr>
<td colspan="2" height="9"></td>
</tr>
<tr>
<td colspan="2" valign="middle"><img src="http://pul7com.godohosting.com/pul7com/open/calculator_name1.gif" width="19" height="19" />
<img src="http://pul7com.godohosting.com/pul7com/open/calculator_jumunsuryang.gif" width="130" height="12" />
<select style="width:110pt; height:13pt" name="onedan">
<option value="">원단선택</option>
<option value="28000">캔버스(28,000원/m2)</option>
<option value="35000">방염(35,000원/m2)</option>
<option value="48000">암막(48,000원/m2)</option>
</select>
<img src="http://pul7com.godohosting.com/pul7com/open/calculator_width.gif" width="36" height="12" />
<input type="text" style="width:30pt; height:9pt" name="xSize" value="" />
<strong><img src="http://pul7com.godohosting.com/pul7com/open/calculator_height.gif" />
<input type="text" style="width:30pt; height:9pt" name="ySize" value="" width="90"/>
<img src="http://pul7com.godohosting.com/pul7com/open/calculator_cm.gif" />
<input type="text" style="width:30pt; height:9pt" name="price" id="price2" value=""width="90"/>
<img src="http://pul7com.godohosting.com/pul7com/open/calculator_m2.gif" />
<a href="javascript:goTest()"><img src="http://pul7com.godohosting.com/pul7com/open/calculator_btn.gif" width="68" height="19" border="0" align="absbottom" /></a></strong></td>
</tr>
<tr>
<td colspan="2" height="12" valign="bottom"><img src="http://pul7com.godohosting.com/pul7com/open/calculator_line3.gif" height="2" /></td>
</tr>
<tr>
<td colspan="2" height="13"></td>
</tr>
<tr>
<td colspan="2" valign="middle"><img src="http://pul7com.godohosting.com/pul7com/open/calculator_name2.gif" width="19" height="19" />
<img src="http://pul7com.godohosting.com/pul7com/open/calculator_kyulkwa.gif" height="12" />
<input type="text" style="width:40pt; height:9pt" name="numbering" id="number" value=""width="90"/>
<img src="http://pul7com.godohosting.com/pul7com/open/calculator_ea.gif" width="27" height="12" /> <img src="http://pul7com.godohosting.com/pul7com/open/calculator_space.gif" width="2" height="3" /><img src="http://pul7com.godohosting.com/pul7com/open/calculator_price.gif" width="35" height="12" />
<input type="text" style="width:40pt; height:9pt" name="price1" id="price1" value=""width="90"/>
<img src="http://pul7com.godohosting.com/pul7com/open/calculator_won.gif" valign="bottom" /></td>
</tr>
<tr>
<td colspan="2" height="12" valign="bottom"><img src="http://pul7com.godohosting.com/pul7com/open/calculator_line3.gif" height="2" /></td>
</tr></form>
</table>
</BODY>
</HTML>
나름대로 이리저리 문제점을 해결해보려고
if(fm.ySize.value == '') {
alert("세로사이즈를 입력해주세요");
fm.ySize.focus();
return;
이부분을 추가하였는데요, 적용이 안되네요., 이 부분 해결점이 무엇일까요??
도움주시면 정말 감사하겠습니다;;^^
사실 자바스크립트 해본적은 없는데, 일이 생겨서 검색이나 질문을 통해
어찌어찌해서 만들었는데요.
이게 또 문제가 생겨서 도대체 답이 안나와서 이렇게 질문을 올립니다 ^^;;
쇼핑몰에 이용되는 간단한 계산기 인데요. 롤스크린 혹은 벽지를 판매하는 곳입니다.
원리는 원단값과 가로 세로 사이즈를 이용하여 가격을 산출하는 계산기 입니다.
원단가격이 28,000원이라고 했을때, 가로 * 세로 값이 100 * 100일경우 기본 가격이 나옵니다.
문제는 가로 * 세로값을 100 * 100 이하로 입력을 하면 기본가격 이하로 나오더라구요...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr" />
<title>Untitled Document</title>
</head>
<script language="javascript">
function goTest() {
//var onedan = '20000'; // 임의의 원단가격
var fm = document.testForm;
if(fm.onedan.value == '') {
alert("원단가격을 선택해주세요");
fm.cnt.focus();
return;
}
if(fm.xSize.value == '') {
alert("가로사이즈를 입력해주세요");
fm.xSize.focus();
return;
}
if(fm.ySize.value == '') {
alert("세로사이즈를 입력해주세요");
fm.ySize.focus();
return;
}
price_t = (fm.xSize.value * fm.ySize.value)*0.0001;
number_t = (fm.xSize.value) * (fm.ySize.value) * fm.onedan.value*0.0000001;
price_t1 = (fm.xSize.value) * (fm.ySize.value) * fm.onedan.value*0.0000001;
if (price_t1*1000 < fm.onedan.value) {
price_t1 == fm.onedan.value;
}
document.getElementById("price2").value = price_t;
document.getElementById("number").value = Math.round(number_t).toFixed(0);
document.getElementById("price1").value = Math.round(price_t1).toFixed(0)*1000;
}
</script>
<body>
<table width="740" border="0" cellspacing="0" cellpadding="0" align="center"><form name="testForm" method="post" >
<tr>
<td height="30"></td></tr>
<tr>
<td colspan="2"><img src="http://pul7com.godohosting.com/pul7com/open/cal_dot.gif" /></td>
</tr>
<tr>
<td colspan="2" height="9"></td>
</tr>
<tr>
<td colspan="2" valign="middle"><img src="http://pul7com.godohosting.com/pul7com/open/calculator_name1.gif" width="19" height="19" />
<img src="http://pul7com.godohosting.com/pul7com/open/calculator_jumunsuryang.gif" width="130" height="12" />
<select style="width:110pt; height:13pt" name="onedan">
<option value="">원단선택</option>
<option value="28000">캔버스(28,000원/m2)</option>
<option value="35000">방염(35,000원/m2)</option>
<option value="48000">암막(48,000원/m2)</option>
</select>
<img src="http://pul7com.godohosting.com/pul7com/open/calculator_width.gif" width="36" height="12" />
<input type="text" style="width:30pt; height:9pt" name="xSize" value="" />
<strong><img src="http://pul7com.godohosting.com/pul7com/open/calculator_height.gif" />
<input type="text" style="width:30pt; height:9pt" name="ySize" value="" width="90"/>
<img src="http://pul7com.godohosting.com/pul7com/open/calculator_cm.gif" />
<input type="text" style="width:30pt; height:9pt" name="price" id="price2" value=""width="90"/>
<img src="http://pul7com.godohosting.com/pul7com/open/calculator_m2.gif" />
<a href="javascript:goTest()"><img src="http://pul7com.godohosting.com/pul7com/open/calculator_btn.gif" width="68" height="19" border="0" align="absbottom" /></a></strong></td>
</tr>
<tr>
<td colspan="2" height="12" valign="bottom"><img src="http://pul7com.godohosting.com/pul7com/open/calculator_line3.gif" height="2" /></td>
</tr>
<tr>
<td colspan="2" height="13"></td>
</tr>
<tr>
<td colspan="2" valign="middle"><img src="http://pul7com.godohosting.com/pul7com/open/calculator_name2.gif" width="19" height="19" />
<img src="http://pul7com.godohosting.com/pul7com/open/calculator_kyulkwa.gif" height="12" />
<input type="text" style="width:40pt; height:9pt" name="numbering" id="number" value=""width="90"/>
<img src="http://pul7com.godohosting.com/pul7com/open/calculator_ea.gif" width="27" height="12" /> <img src="http://pul7com.godohosting.com/pul7com/open/calculator_space.gif" width="2" height="3" /><img src="http://pul7com.godohosting.com/pul7com/open/calculator_price.gif" width="35" height="12" />
<input type="text" style="width:40pt; height:9pt" name="price1" id="price1" value=""width="90"/>
<img src="http://pul7com.godohosting.com/pul7com/open/calculator_won.gif" valign="bottom" /></td>
</tr>
<tr>
<td colspan="2" height="12" valign="bottom"><img src="http://pul7com.godohosting.com/pul7com/open/calculator_line3.gif" height="2" /></td>
</tr></form>
</table>
</BODY>
</HTML>
나름대로 이리저리 문제점을 해결해보려고
if(fm.ySize.value == '') {
alert("세로사이즈를 입력해주세요");
fm.ySize.focus();
return;
이부분을 추가하였는데요, 적용이 안되네요., 이 부분 해결점이 무엇일까요??
도움주시면 정말 감사하겠습니다;;^^
댓글 전체
정확한 공식이 필요하지만 일단 대략 사이즈(가로,세로)가 100 이하일경우에는 100으로 인식하도록 변경하려면..
스크립트 상
xSizeNum = 0;
ySizeNum = 0;
if(fm.xSize.value < 100) xSizeNum = 100;
if(fm.ySize.value < 100) ySizeNum = 100;
price_t = (ySizeNum * ySizeNum)*0.0001;
number_t = (ySizeNum) * (ySizeNum) * fm.onedan.value*0.0000001;
price_t1 = (ySizeNum) * (ySizeNum) * fm.onedan.value*0.0000001;
if (price_t1*1000 < fm.onedan.value) {
price_t1 == fm.onedan.value;
}
document.getElementById("price2").value = price_t;
document.getElementById("number").value = Math.round(number_t).toFixed(0);
document.getElementById("price1").value = Math.round(price_t1).toFixed(0)*1000;
으로 추가 및 변경 해주셔야 하고요..
에러 나는곳이 한군대 더 있습니다..
fm.cnt.focus();
cnt 라는 name을 가진 태그가 존재 하지 않아서 에러가 발생합니다.
그리고 적어주신 세로사이즈 관련 스크립트는 정상작동합니다.
해당 스크립트와 가격 산정하는데에는 연관성이 없습니다.
스크립트 상
xSizeNum = 0;
ySizeNum = 0;
if(fm.xSize.value < 100) xSizeNum = 100;
if(fm.ySize.value < 100) ySizeNum = 100;
price_t = (ySizeNum * ySizeNum)*0.0001;
number_t = (ySizeNum) * (ySizeNum) * fm.onedan.value*0.0000001;
price_t1 = (ySizeNum) * (ySizeNum) * fm.onedan.value*0.0000001;
if (price_t1*1000 < fm.onedan.value) {
price_t1 == fm.onedan.value;
}
document.getElementById("price2").value = price_t;
document.getElementById("number").value = Math.round(number_t).toFixed(0);
document.getElementById("price1").value = Math.round(price_t1).toFixed(0)*1000;
으로 추가 및 변경 해주셔야 하고요..
에러 나는곳이 한군대 더 있습니다..
fm.cnt.focus();
cnt 라는 name을 가진 태그가 존재 하지 않아서 에러가 발생합니다.
그리고 적어주신 세로사이즈 관련 스크립트는 정상작동합니다.
해당 스크립트와 가격 산정하는데에는 연관성이 없습니다.
답변 해 주셔서 정말 감사합니다^^
제가 실수를 했네요,, 추가한 부분은 이곳
if (price_t1*1000 < fm.onedan.value) {
price_t1 == fm.onedan.value;
}
이었구요,,
말씀 해주신 대로 수정을 하니 세로가 100이하일때는 작동을 하는데
100이상이 되니 작동을 하지 않네요,,
가로의 경우는 적용이 안됩니다.. 혹시 이 부분도 봐주실 수 있으신가요??
제가 실수를 했네요,, 추가한 부분은 이곳
if (price_t1*1000 < fm.onedan.value) {
price_t1 == fm.onedan.value;
}
이었구요,,
말씀 해주신 대로 수정을 하니 세로가 100이하일때는 작동을 하는데
100이상이 되니 작동을 하지 않네요,,
가로의 경우는 적용이 안됩니다.. 혹시 이 부분도 봐주실 수 있으신가요??
감사합니다. 해결되었습니다^^ 또 하나 배웠네요!!
다행이군요.~~
코드상 누락된부분이 있네요 ^^; 테스트를 해보지 않았던거라서;
if(fm.xSize.value < 100) xSizeNum = 100;
else xSizeNum = fm.xSize.value;
if(fm.ySize.value < 100) ySizeNum = 100;
else ySizeNum = fm.ySize.value;
코드상 누락된부분이 있네요 ^^; 테스트를 해보지 않았던거라서;
if(fm.xSize.value < 100) xSizeNum = 100;
else xSizeNum = fm.xSize.value;
if(fm.ySize.value < 100) ySizeNum = 100;
else ySizeNum = fm.ySize.value;
