스크립트 문의드립니다.
본문
안녕하세요 아래 소스는 계산기 스크립트 소스로
일정 금액을 입력하면 요율을 적용하여 그 값이 나오는 계산기입니다.
여기에 두가지만 문의드릴 사항이 있습니다.
1. 결과값이 입력값(금액)의 요율이 적용된 값만 출력되는데 결과값 밑에 추가하여 입력값에 결과값이 빠진 금액도 표시하고 싶습니다.
2. 주석으로 처리한 부분 p1 시작..p1끝 이부분을 현재 페이지에 더 추가를 할수 있나요??
적어도 한페이지에 독립적으로 작동하는 계산기를 몇개 표시하여 쓰고 싶은데 스크립트 충돌은 없는지 궁금합니다.........
답변 부탁드립니다 (__);;;;;;;;;;;;;;;;;;;;;;;;;
<script language='Javascript'>
/// VAT 계산 하기 //////////
//////////////////////// 문자열 치환 //////////////////////
function replace(str,sstr,rstr) { // 문자열 치환
return String(str).replace(new RegExp(sstr,"ig"),rstr);
}
//////////////////////// 문자열 치환 //////////////////////
//////////// 실시간 콤마 /////////////////////
function tagin_net_comma(tagin_net_str) {
var t_align = "right"; // 텍스트 필드 정렬
var t_num = tagin_net_str.value.substring(0,1); // 첫글자 확인 변수
var num = /^[/,/,0,1,2,3,4,5,6,7,8,9,/]/; // 숫자와 , 만 가능
var tagin_netValue = "";
var tagin_netValue2 = "";
if (!num.test(tagin_net_str.value)) {
alert('숫자만 입력하십시오.nn특수문자와 한글/영문은 사용할수 없습니다.');
tagin_net_str.value="";
tagin_net_str.focus();
return false;
}
if ((t_num < "0" || "9" < t_num)){
alert("숫자만 입력하십시오.");
tagin_net_str.value="";
tagin_net_str.focus();
return false;
}
for(i=0; i<tagin_net_str.value.length; i++) {
if(tagin_net_str.value.charAt(tagin_net_str.value.length - i -1) != ",") {
tagin_netValue2 = tagin_net_str.value.charAt(tagin_net_str.value.length - i -1) + tagin_netValue2;
}
}
for(i=0; i<tagin_netValue2.length; i++) {
if(i > 0 && (i%3)==0) {
tagin_netValue = tagin_netValue2.charAt(tagin_netValue2.length - i -1) + "," + tagin_netValue;
} else {
tagin_netValue = tagin_netValue2.charAt(tagin_netValue2.length - i -1) + tagin_netValue;
}
}
tagin_net_str.value = tagin_netValue;
tagin_net_str.style.textAlign = t_align;
}
//////////// 실시간 콤마 /////////////////////
///////////////// 콤마 나누는 부분 ////////////////
function commaSplit(srcNumber) {
var txtNumber = '' + srcNumber;
var rxSplit = new RegExp('([0-9])([0-9][0-9][0-9][,.])');
var arrNumber = txtNumber.split('.');
arrNumber[0] += '.';
do {
arrNumber[0] = arrNumber[0].replace(rxSplit, '$1,$2');
}
while (rxSplit.test(arrNumber[0]));
if (arrNumber.length > 1) {
return arrNumber.join('');
}
else {
return arrNumber[0].split('.')[0];
}
}
///////////////// 콤마 나누는 부분 ////////////////
function tagin_net_vat(){
var f = document.tagin_netform;
var tagin_net_vat_rate = (f.tagin_net_rate.value/100);
var tagin_net_money = replace(f.tagin_net_money.value,',','');
var tagin_net_vat_money= (tagin_net_money * tagin_net_vat_rate);
var tagin_net_vat_money_plus = (tagin_net_vat_money - (tagin_net_money * -1));
f.tagin_net_vat_money.value = commaSplit(parseInt(tagin_net_vat_money));
f.tagin_net_vat_money_plus.value = commaSplit(parseInt(tagin_net_vat_money_plus));
}
</script>
<!--p1 시작-->
<form name="tagin_netform">
<table border="0" bgcolor="#CCCCCC" cellpadding="5" cellspacing="1" align="center">
<tr align="center" bgcolor="white"><td colspan="2">김용운 매니져님 전용 계산기</td></tr>
<tr align="center" bgcolor="white">
<td>금액</td><td align="left"><input type="text" size="15" name="tagin_net_money" value=""onKeyUp="tagin_net_comma(this);tagin_net_vat()"> 원</td>
</tr>
<tr align="center" bgcolor="white">
<td>요율</td><td align="left"><input type="text" size="15" name="tagin_net_rate" value="10" onFocus="this.select()" onKeyUp="tagin_net_vat()" style="text-align:right;"> %</td>
</tr>
<tr align="center" bgcolor="white">
<td>결과값</td><td align="left"><input type="text" size="15" name="tagin_net_vat_money" value="" onFocus="this.blur()" readonly style="text-align:right;"> 원</td>
</tr>
</table>
</form>
<!--p1 끝-->
답변 1
1. 빠진 값이라는게... 만약 13을 입력하면 0.3 이런걸 말씀하시는건지....
2. 프로토타입으로 사용하시면 됩니다만... 이건 좀 어려워 하실거 같고....
해당 form 문을 두개를 만들어서 그안에서만 계산식을 짜시면 될거 같습니다
예를 들어
function tagin_net_vat() {
var f = document.tagin_netform;
var tagin_net_vat_rate = (f.tagin_net_rate.value / 100);
var tagin_net_money = replace(f.tagin_net_money.value, ',', '');
var tagin_net_vat_money = (tagin_net_money * tagin_net_vat_rate);
var tagin_net_vat_money_plus = (tagin_net_vat_money - (tagin_net_money * -1));
f.tagin_net_vat_money.value = commaSplit(parseInt(tagin_net_vat_money));
f.tagin_net_vat_money_plus.value = commaSplit(parseInt(tagin_net_vat_money_plus));
}
요걸 요렇게
p1
<form name="tagin_netform" >
tagin_net_vat(document.tagin_netform);
</form>
p2
<form name="tagin_netform2" >
tagin_net_vat(document.tagin_netform2);
</form>
function tagin_net_vat(obj) {
var f = obj;
var tagin_net_vat_rate = (f.tagin_net_rate.value / 100);
var tagin_net_money = replace(f.tagin_net_money.value, ',', '');
var tagin_net_vat_money = (tagin_net_money * tagin_net_vat_rate);
var tagin_net_vat_money_plus = (tagin_net_vat_money - (tagin_net_money * -1));
f.tagin_net_vat_money.value = commaSplit(parseInt(tagin_net_vat_money));
f.tagin_net_vat_money_plus.value = commaSplit(parseInt(tagin_net_vat_money_plus));
}
1000을 입력하는 경우 10 요율이라고 하면
값이 100 원인데 그 밑에 900 원도 출력하게 추가하고 싶거든요........
폼문에 추가
<tr align="center" bgcolor="white" >
<td > 나머지 </td >
<td align="left" >
<input type="text" size="15" name="tagin_net_vat_remind" value="" onFocus="this.blur()" readonly style="text-align:right;" > 원
</td >
</tr >
tagin_net_vat 함수에 추가
var tagin_net_vat_remind = tagin_net_money-tagin_net_vat_money;
f.tagin_net_vat_remind.value = tagin_net_vat_remind;
function tagin_net_vat(){
var f = document.tagin_netform;
var tagin_net_vat_rate = (f.tagin_net_rate.value/100);
var tagin_net_money = replace(f.tagin_net_money.value,',','');
var tagin_net_vat_money= (tagin_net_money * tagin_net_vat_rate);
var tagin_net_vat_money_plus = (tagin_net_vat_money - (tagin_net_money * -1));
var tagin_net_vat_remind = tagin_net_money-tagin_net_vat_money;
f.tagin_net_vat_remind.value = commaSplit(parseInt(tagin_net_vat_remind));
f.tagin_net_vat_money.value = commaSplit(parseInt(tagin_net_vat_money));
f.tagin_net_vat_money_plus.value = commaSplit(parseInt(tagin_net_vat_money_plus));
}
function tagin_net_vat(obj) {
var f = obj;
var tagin_net_vat_rate = (f.tagin_net_rate.value / 100);
var tagin_net_money = replace(f.tagin_net_money.value, ',', '');
var tagin_net_vat_money = (tagin_net_money * tagin_net_vat_rate);
var tagin_net_vat_money_plus = (tagin_net_vat_money - (tagin_net_money * -1));
f.tagin_net_vat_remind.value = commaSplit(parseInt(tagin_net_vat_remind));
f.tagin_net_vat_money.value = commaSplit(parseInt(tagin_net_vat_money));
f.tagin_net_vat_money_plus.value = commaSplit(parseInt(tagin_net_vat_money_plus));
}
</script>
<form name="tagin_netform">
<table border="0" bgcolor="#CCCCCC" cellpadding="5" cellspacing="1" align="center">
<tr align="center" bgcolor="white"><td colspan="2">다나와</td></tr>
<tr align="center" bgcolor="white">
<td>금액</td><td align="left"><input type="text" size="15" name="tagin_net_money" value=""onKeyUp="tagin_net_comma(this);tagin_net_vat()"> 원</td>
</tr>
<tr align="center" bgcolor="white">
<td>요율</td><td align="left"><input type="text" size="15" name="tagin_net_rate" value="10" onFocus="this.select()" onKeyUp="tagin_net_vat()" style="text-align:right;"> %</td>
</tr>
<tr align="center" bgcolor="white">
<td>요율값</td><td align="left"><input type="text" size="15" name="tagin_net_vat_money" value="" onFocus="this.blur()" readonly style="text-align:right;"> 원</td>
</tr>
<tr align="center" bgcolor="white" >
<td>결과값</td ><td align="left" ><input type="text" size="15" name="tagin_net_vat_remind" value="" onFocus="this.blur()" readonly style="text-align:right;" > 원</td >
</tr >
</table>
</form>
<form name="tagin_netform2">
<table border="0" bgcolor="#CCCCCC" cellpadding="5" cellspacing="1" align="center">
<tr align="center" bgcolor="white"><td colspan="2">G마켓</td></tr>
<tr align="center" bgcolor="white">
<td>금액</td><td align="left"><input type="text" size="15" name="tagin_net_money" value=""onKeyUp="tagin_net_comma(this);tagin_net_vat(document.tagin_netform2)"> 원</td>
</tr>
<tr align="center" bgcolor="white">
<td>요율</td><td align="left"><input type="text" size="15" name="tagin_net_rate" value="10" onFocus="this.select()" onKeyUp="tagin_net_vat(document.tagin_netform2)" style="text-align:right;"> %</td>
</tr>
<tr align="center" bgcolor="white">
<td>요율값</td><td align="left"><input type="text" size="15" name="tagin_net_vat_money" value="" onFocus="this.blur()" readonly style="text-align:right;"> 원</td>
</tr>
<tr align="center" bgcolor="white" >
<td>결과값</td ><td align="left" ><input type="text" size="15" name="tagin_net_vat_remind" value="" onFocus="this.blur()" readonly style="text-align:right;" > 원</td >
</tr >
</table>
</form>
<form name="tagin_netform3">
<table border="0" bgcolor="#CCCCCC" cellpadding="5" cellspacing="1" align="center">
<tr align="center" bgcolor="white"><td colspan="2">옥션</td></tr>
<tr align="center" bgcolor="white">
<td>금액</td><td align="left"><input type="text" size="15" name="tagin_net_money" value=""onKeyUp="tagin_net_comma(this);tagin_net_vat(document.tagin_netform3)"> 원</td>
</tr>
<tr align="center" bgcolor="white">
<td>요율</td><td align="left"><input type="text" size="15" name="tagin_net_rate" value="10" onFocus="this.select()" onKeyUp="tagin_net_vat(document.tagin_netform3)" style="text-align:right;"> %</td>
</tr>
<tr align="center" bgcolor="white">
<td>요율값</td><td align="left"><input type="text" size="15" name="tagin_net_vat_money" value="" onFocus="this.blur()" readonly style="text-align:right;"> 원</td>
</tr>
<tr align="center" bgcolor="white" >
<td>결과값</td ><td align="left" ><input type="text" size="15" name="tagin_net_vat_remind" value="" onFocus="this.blur()" readonly style="text-align:right;" > 원</td >
</tr >
</table>
</form>
안되네요 ㅡㅜ
아주 잘 되는데요 ??
tagin_net_vat_money_plus 는 없어서 에러가 발생하기 때문에 주석 넣었습니다.
<script language='Javascript'>
/// VAT 계산 하기 //////////
//////////////////////// 문자열 치환 //////////////////////
function replace(str,sstr,rstr) { // 문자열 치환
return String(str).replace(new RegExp(sstr,"ig"),rstr);
}
//////////////////////// 문자열 치환 //////////////////////
//////////// 실시간 콤마 /////////////////////
function tagin_net_comma(tagin_net_str) {
var t_align = "right"; // 텍스트 필드 정렬
var t_num = tagin_net_str.value.substring(0,1); // 첫글자 확인 변수
var num = /^[/,/,0,1,2,3,4,5,6,7,8,9,/]/; // 숫자와 , 만 가능
var tagin_netValue = "";
var tagin_netValue2 = "";
if (!num.test(tagin_net_str.value)) {
alert('숫자만 입력하십시오.nn특수문자와 한글/영문은 사용할수 없습니다.');
tagin_net_str.value="";
tagin_net_str.focus();
return false;
}
if ((t_num < "0" || "9" < t_num)){
alert("숫자만 입력하십시오.");
tagin_net_str.value="";
tagin_net_str.focus();
return false;
}
for(i=0; i<tagin_net_str.value.length; i++) {
if(tagin_net_str.value.charAt(tagin_net_str.value.length - i -1) != ",") {
tagin_netValue2 = tagin_net_str.value.charAt(tagin_net_str.value.length - i -1) + tagin_netValue2;
}
}
for(i=0; i<tagin_netValue2.length; i++) {
if(i > 0 && (i%3)==0) {
tagin_netValue = tagin_netValue2.charAt(tagin_netValue2.length - i -1) + "," + tagin_netValue;
} else {
tagin_netValue = tagin_netValue2.charAt(tagin_netValue2.length - i -1) + tagin_netValue;
}
}
tagin_net_str.value = tagin_netValue;
tagin_net_str.style.textAlign = t_align;
}
//////////// 실시간 콤마 /////////////////////
///////////////// 콤마 나누는 부분 ////////////////
function commaSplit(srcNumber) {
var txtNumber = '' + srcNumber;
var rxSplit = new RegExp('([0-9])([0-9][0-9][0-9][,.])');
var arrNumber = txtNumber.split('.');
arrNumber[0] += '.';
do {
arrNumber[0] = arrNumber[0].replace(rxSplit, '$1,$2');
}
while (rxSplit.test(arrNumber[0]));
if (arrNumber.length > 1) {
return arrNumber.join('');
}
else {
return arrNumber[0].split('.')[0];
}
}
///////////////// 콤마 나누는 부분 ////////////////
function tagin_net_vat(obj){
var f = obj;
var tagin_net_vat_rate = (f.tagin_net_rate.value/100);
var tagin_net_money = replace(f.tagin_net_money.value,',','');
var tagin_net_vat_money= (tagin_net_money * tagin_net_vat_rate);
var tagin_net_vat_money_plus = (tagin_net_vat_money - (tagin_net_money * -1));
var tagin_net_vat_remind = tagin_net_money-tagin_net_vat_money;
f.tagin_net_vat_remind.value = tagin_net_vat_remind;
f.tagin_net_vat_money.value = commaSplit(parseInt(tagin_net_vat_money));
//f.tagin_net_vat_money_plus.value = commaSplit(parseInt(tagin_net_vat_money_plus));
}
</script>
<!--p1 시작-->
<form name="tagin_netform">
<table border="0" bgcolor="#CCCCCC" cellpadding="5" cellspacing="1" align="center">
<tr align="center" bgcolor="white"><td colspan="2">김용운 매니져님 전용 계산기</td></tr>
<tr align="center" bgcolor="white">
<td>금액</td><td align="left"><input type="text" size="15" name="tagin_net_money" value=""onKeyUp="tagin_net_comma(this);tagin_net_vat(document.tagin_netform)"> 원</td>
</tr>
<tr align="center" bgcolor="white">
<td>요율</td><td align="left"><input type="text" size="15" name="tagin_net_rate" value="10" onFocus="this.select()" onKeyUp="tagin_net_vat(document.tagin_netform)" style="text-align:right;"> %</td>
</tr>
<tr align="center" bgcolor="white">
<td>결과값</td><td align="left"><input type="text" size="15" name="tagin_net_vat_money" value="" onFocus="this.blur()" readonly style="text-align:right;"> 원</td>
</tr>
<tr align="center" bgcolor="white" >
<td > 나머지 </td >
<td align="left" >
<input type="text" size="15" name="tagin_net_vat_remind" value="" onFocus="this.blur()" readonly style="text-align:right;" > 원
</td >
</tr >
</table>
</form>
<!--p1 끝-->
