여러 사용자 선택에 따라 변수를 효율적으로 정의하는 방법은 무엇입니까?

Question

저는 회사 웹 사이트를위한 프로그램을 작성하고 있습니다.이 프로그램은 전화로 시간표를 찍을 수있게 해주는 프로그램입니다. 그들이 팔고있는 물건 중의 1 개는 지붕을위한 산등성이 모자 다. 이 품목의 가격은 사용자가 내린 4 가지 결정에 의해 결정됩니다.

1. 고객의 가격 수준, 3 개 선택 (라디오 버튼)
2. 조건, 2 개 선택 (평면 또는 조각, 드롭 다운 상자)이
3. 색상, 4 개 선택 (드롭 다운 상자)
가되어 있습니다
4. 너비, 14 개 선택 가능 (드롭 다운 상자)

지금까지 나는이 변수를 1000 줄 이상의 코드 인 거대한 If ... else if 문으로 정의했습니다. 문제는 대부분의 제품이 동일하며이 속도로 끝내려면 몇 달이 걸릴 것입니다. 아래에 스크립트를 따라 HTML을 게시합니다. 도움을 줄 수있는 사람에게 미리 감사드립니다. (참고 : 필자는 문제 해결에 도움이된다고 생각한 코드 만 게시했습니다. 테이블과 같은 주변 태그를 알고 있다고 가정)

HTML for color selection ... (각 색상이 가격을 변경합니다)

트림 용

<td><form name="form2" method="post" action=""> 
<label for="color"></label> 
<select name="color" id="color"> 
<option value="galvanized">galvanized</option> 
<option value="galvalume">galvalume</option> 
<option value="metallic copper">metallic copper</option> 
<option value="red">red</option>// there are many painted colors which is why i use "else" for this price change. 
</select> 
</form> 

HTML (조건의 선택 폭) 가격 레벨

<td>Ridge:</td> 
<td><select id="ridgeChoice" name="ridgeChoice"> 
<option value="Sculpted">Sculpted</option> 
<option value="Flat">Flat</option> 
</select>&nbsp;Qty: 
<input id="ridgeTrim" type="text" value="" size="3">&nbsp; Width:<select id="ridgeWidth" name="ridgeWidth"> 
<option value="13">13"</option> 
<option value="16">16"</option> 
<option value="18">18"</option> 
<option value="20">20"</option> 
<option value="22">22"</option> 
<option value="24">24"</option> 
<option value="26">26"</option> 
<option value="28">28"</option> 
<option value="30">30"</option> 
<option value="32">32"</option> 
<option value="34">34"</option> 
<option value="36">36"</option> 
<option value="38">38"</option> 
<option value="40">40"</option> 
</select> 
</td> 

되는 HTML 간단히 또한 가격에 영향을 미친다 세 가지 선택 라디오 그룹이다. 이 1000 개 선을 위해 계속

var ridgeChoice=document.getElementById("ridgeChoice").value; 
var ridgeWidth=document.getElementById("ridgeWidth").value; 

var ridgePrice; 
if (ridgeChoice=="Sculpted") 
{ 
if (retailPrice.checked) 
{ 
    if (ridgeWidth=="13") 
     { 
      if(colorChoice=="galvalume") 
      { 
       ridgePrice=14.70; 
      } 
      else if (colorChoice=="metallic copper") 
      { 
       ridgePrice=19.55; 
      } 
      else if (colorChoice=="galvanized") 
      { 
       ridgePrice=13.35; 
      } 
      else 
      { 
       ridgePrice=16.65; 
      } 
     } 
        else if (ridgeWidth=="16") 
     { 
      if(colorChoice=="galvalume") 
      { 
       ridgePrice=21.30; 
      } 
      else if (colorChoice=="metallic copper") 
      { 
       ridgePrice=29.50; 
      } 
      else if (colorChoice=="galvanized") 
      { 
       ridgePrice=20.5; 
      } 
      else 
      { 
       ridgePrice=22.90; 
      } 
     } 

자바 스크립트 .... 다양한 사용자 선택에 따라 변수를 정의하는 더 좋은 방법이 있습니까?

Answer 1

왜 선택 사항과 가격을 속성 파일에 넣지 마십시오. 속성 파일은 키 값 쌍에서 작동하므로 사용자 선택에서 해당 키를 가져와 속성에 대해 가격을 가져와야합니다. 이렇게하면 가격과 색상을 하드 코딩하지 않아도됩니다. HTML로 드롭 다운을 생성 한 다음 자바 스크립트를 사용하여 입력 할 수 있습니다. Java 파일에서 특성 파일 읽기 논리를 가질 수 있습니다.이 논리 파일은 자바 스크립트에서 참조 할 수 있습니다.

귀하의 등록 정보 파일은 다음과 같이 보일 수 있습니다 :

galvalume=14.70 
galvanized=13.35 

는 희망이 도움이!