2011-01-27 6 views
0
여기

을 onKeyUp에에 응답하지 않는 것은 코드가 내 테이블 초기화 : 나는 선언 이상의 테이블 및 기타 onKeyUp에 기능을HTML 입력이

<script type="text/javascript"> 
var total = 0.0; 
var all=new Array(); 
for(var i = 0; i < 49; i++) 
    all[i] = 0; 

//....I OMMITTED CODE HERE FOR THE REST OF THE onkeyup FUNCTIONS 
document.getElementById("s1").onkeyup = function() { 
    if(this.value != "") { 
     all[44] = (parseInt(this.value,10) * 6.50); 
    } 
    else { 
     all[44] = 0; 
    } 
    updateIt(); 
}; 

document.getElementById("s2").onkeyup = function() { 
    if(this.value != "") { 
     all[45] = (parseInt(this.value,10) * 6.50); 
    } 
    else { 
     all[45] = 0; 
    } 
    updateIt(); 
}; 

document.getElementById("s3").onkeyup = function() { 
    if(this.value != "") { 
     all[46] = (parseInt(this.value,10) * 6.50); 
    } 
    else { 
     all[46] = 0; 
    } 
    updateIt(); 
}; 
document.getElementById("s4").onkeyup = function() { 
    if(this.value != "") { 
     all[47] = (parseInt(this.value,10) * 6.50); 
    } 
    else { 
     all[47] = 0; 
    } 
    updateIt(); 
}; 

document.getElementById("s5").onkeyup = function() { 
    document.getElementById("mySpan").innerHTML = "WOAH"; 

    if(this.value != "") { 
     all[48] = (parseInt(this.value,10) * 6.50); 
    } 
    else { 
     all[48] = 0; 
    } 
    updateIt(); 
}; 

function updateIt() { 
    var theTotal = 0; 
    for(var j = 0; j < 49; j++) 
     theTotal += all[j]; 

    theTotal = all[48]; 
    document.getElementById("mySpan").innerHTML = "$" + theTotal.toFixed(2); 
} 
</script> 

참고 : 여기

<table cellspacing="0"> 
     <caption id="title4"> 
      Sprinkles (5 - 6 oz.) 
        </caption> 
     <thead> 
      <tr> 
       <th>&nbsp;</th> 
            <td >Price</td> 
            <td >Quantity</td> 
          </tr> 
     </thead> 
     <tbody> 
         <tr class="statement4"> 
       <th><label>Lemon</label></th> 
           <td title="Yes" > 
        <label>$6.50</label> 
       </td> 
           <td title="No" > 
        <input id="s1" name="s1" class="field text small" type="text" value="0"/> 
       </td> 
          <tr class="statement4"> 
       <th><label>Sweet Apple</label></th> 
           <td title="Yes" > 
        <label>$6.50</label> 
       </td> 
           <td title="No" > 
        <input id="s2" name="s2" class="field text small" type="text" value="0"/> 
       </td> 

       <tr class="statement4"> 
       <th><label>Sweet Caramel</label></th> 
           <td title="Yes" > 
        <label>$6.50</label> 
       </td> 
           <td title="No" > 
        <input id="s3" name="s3" class="field text small" type="text" value="0"/> 
       </td> 

       <tr class="statement4"> 
       <th><label>Sweet Cinnamon</label></th> 
           <td title="Yes" > 
        <label>$6.50</label> 
       </td> 
           <td title="No" > 
        <input id="s4" name="s4" class="field text small" type="text" value="0"/> 
       </td> 

       <tr class="statement4"> 
       <th><label>Sweet Mocha</label></th> 
           <td title="Yes" > 
        <label>$6.50</label> 
       </td> 
           <td title="No" > 
        <input id="s5" name="s5" class="field text small" type="text" value="0"/> 
       </td> 
         </tr> 
        </tbody> 
    </table> 

그리고 나의 자바 스크립트입니다 ,하지만이 테이블 다음에있는 모든 테이블 (몇 가지 테이블이 있고 처음 세 개는 제대로 작동합니다)에 대한 몇 가지 이유 때문에 각각의 onkeyup 이벤트에 응답하지 마십시오. 당신이 찾고 있지만

<table cellspacing="0"> 
    <caption id="title4"> 
     Rubs (1.2 - 2.3oz.) 
       </caption> 
    <thead> 
     <tr> 
      <th>&nbsp;</th> 
           <td >Price</td> 
           <td >Quantity</td> 
         </tr> 
    </thead> 
    <tbody> 
        <tr class="statement4"> 
      <th><label>Buffalo</label></th> 
          <td title="Yes" > 
       <label>$4.25</label> 
      </td> 
          <td title="No" > 
       <input id="rubs1" name="rubs1" class="field text small" type="text" value="0"/> 
      </td> 
         <tr class="statement4"> 
      <th><label>Chipotle</label></th> 
          <td title="Yes" > 
       <label>$4.25</label> 
      </td> 
          <td title="No" > 
       <input id="rubs2" name="rubs2" class="field text small" type="text" value="0"/> 
      </td> 

      <tr class="statement4"> 
      <th><label>Citrus</label></th> 
          <td title="Yes" > 
       <label>$4.25</label> 
      </td> 
          <td title="No" > 
       <input id="rubs3" name="rubs3" class="field text small" type="text" value="0"/> 
      </td> 

      <tr class="statement4"> 
      <th><label>Creole</label></th> 
          <td title="Yes" > 
       <label>$4.25</label> 
      </td> 
          <td title="No" > 
       <input id="rubs4" name="rubs4" class="field text small" type="text" value="0"/> 
      </td> 

      <tr class="statement4"> 
      <th><label>Crushed Peppercorn & Garlic</label></th> 
          <td title="Yes" > 
       <label>$4.25</label> 
      </td> 
          <td title="No" > 
       <input id="rubs5" name="rubs5" class="field text small" type="text" value="0"/> 
      </td> 

      <tr class="statement4"> 
      <th><label>Greek</label></th> 
          <td title="Yes" > 
       <label>$4.25</label> 
      </td> 
          <td title="No" > 
       <input id="rubs6" name="rubs6" class="field text small" type="text" value="0"/> 
      </td> 

      <tr class="statement4"> 
      <th><label>Jamaican Jerk</label></th> 
          <td title="Yes" > 
       <label>$4.25</label> 
      </td> 
          <td title="No" > 
       <input id="rubs7" name="rubs7" class="field text small" type="text" value="0"/> 
      </td> 

      <tr class="statement4"> 
      <th><label>Lemon Pepper</label></th> 
          <td title="Yes" > 
       <label>$4.25</label> 
      </td> 
          <td title="No" > 
       <input id="rubs8" name="rubs8" class="field text small" type="text" value="0"/> 
      </td> 

      <tr class="statement4"> 
      <th><label>Moroccan/label></th> 
          <td title="Yes" > 
       <label>$4.25</label> 
      </td> 
          <td title="No" > 
       <input id="rubs9" name="rubs9" class="field text small" type="text" value="0"/> 
      </td> 

      <tr class="statement4"> 
      <th><label>Smoky Barbecue</label></th> 
          <td title="Yes" > 
       <label>$4.25</label> 
      </td> 
          <td title="No" > 
       <input id="rubs10" name="rubs10" class="field text small" type="text" value="0"/> 
      </td> 

      <tr class="statement4"> 
      <th><label>Thai Red Curry</label></th> 
          <td title="Yes" > 
       <label>$4.25</label> 
      </td> 
          <td title="No" > 
       <input id="rubs11" name="rubs11" class="field text small" type="text" value="0"/> 
      </td> 
        </tr> 
       </tbody> 
</table> 
+2

HTML에 표 행 끝 태그 ('')가 누락되어 있습니다. – jmbucknall

+0

그런 다음 제대로 작동하는 마지막 테이블 (및 해당 이벤트 처리기)을 최소한 보여줄 수 있습니까? 뭔가 문제가있을 수 있습니다. 또한, 당신의 코드를 약간 리팩터링 할 것을 권하고 싶습니다. 모든 이벤트 핸들러는 거의 같습니다. –

+0

나는 마지막 테이블에 대한 코드를 게시했습니다. – CodeGuy

답변

0
var theTotal = 0; 
for(var j = 0; j < 49; j++) 
    theTotal += all[j]; 

theTotal = all[48]; 

가 왜 이러는 거죠? 먼저 모든 가격의 합계를 계산 한 다음 마지막 값만 theTotal에 할당합니다. 이것은 나에게 잘못된 것처럼 보인다.

+0

나는 그것을 테스트하기 위해 이것을하고 있었다 ... 논리는 아무런 차이가 없다. onkeyup 함수를 호출하는 방법을 알아낼 수 없다는 사실입니다. – CodeGuy

+0

@ reising1 :하지만 Cybernate의 바이올린에서 해당 줄을 제거하면 Firefox 4b9에서 적어도 저에게는 적합합니다 (http://jsfiddle.net/yVaMx/6/). –

0

당신은 ID가 "mySpan"에 의해 요소가 누락되었습니다 : 여기

이 일을 마지막 테이블에 대한 코드 (이 코드는 내가 위에서 게시 된 테이블을 생성 바로 코드 이상) JS (document.getElementById("mySpan").innerHTML)에 들어 있으므로 오류가 발생합니다.

해당 ID를 가진 HTML 요소를 추가하면 올바르게 작동합니다.

확인 jsfiddle : http://jsfiddle.net/Chandu/yVaMx/5/

+0

나는 그 코드를 보여주지 않았다. 위에서 말했듯이이 테이블 위에 테이블을 추가하여 "mySpan"을 업데이트합니다. – CodeGuy

+0

그러나 mySpan 요소를 추가하면 키 이벤트가 트리거 된 것을 볼 수 있습니다. (jsFiddle : http://jsfiddle.net 확인/Chandu/yVaMx/5 /) – Chandu

관련 문제