배열 자체 재설정 자바 스크립트

나는 버튼 클릭으로 사용자의 값을 받아들이고 객체 배열에 저장하는 프로그램을 만들기로 결정했습니다. 다른 버튼을 클릭하면 innerHTML에 씁니다. 단락 배열 자체 재설정 자바 스크립트

<!DOCTYPE HTML> 
<html> 
<head> 
<script> 
var records = new Array(); 
var counter = 0; 
var t = document.getElementById("show"); 
function record(name,age,cla) 
{ 
this.name=name; 
this.age=age; 
this.cla=cla; 
} 
function add() 
{ 
var r1 = new record(frm1.name.value,frm1.age.value,frm1.clas.value); 
alert(r1.name); 
records.push(r1); 
alert(records[0].name); 
} 
function show() 
{alert(records.length); 
for(var i=counter;i<records.length;i++,counter++) 
{ 
    t.innerHTML+= records[i].name+" "+records[i].age+"  "+records[i].cla+"<br>"; 
} 
} 
function clear() 
{ 
t.innerHTML=""; 
counter=0; 
} 
</script> 
</head> 
<body> 
    <form id = "frm1" > 
     name : <input type = text id = "name"> 
     age : <input type = text id = "age"> 
     class : <input type = text id = "clas"> 
     <button onclick= "add()">add</button> 
     <button onclick = "show()">show</button> 
     <button onclick = "clear()">clear</button> 
    </form><br> 
    <p id = "show"></p> 
</body> 
</html>

이 때문에 디버깅 후에 나는 요소가 적절히 첨가하는 것이 발견하지만 난 records.length 0을 표시하고 표시 방법 ..를 호출 할 때마다 그 이유 배열 자체가 리셋된다?

출처

2013-12-22 B0rn2C0de

세 가지 문제 :

1) 귀하의 양식을 따라서 당신이 당신의 버튼 중 하나를 클릭하면 제출하려고하고 페이지를 다시로드의 원인이된다. 페이지가 다시로드되면 모든 항목이 다시 초기화되므로 배열이 비어 있습니다.

버튼 클릭의 기본 동작을 방지하기 위해 을 호출하여 문제를 해결할 수 있습니다.

2) 페이지가 파싱되기 전에 document.getElementById("show")으로 전화를 걸므로 항상 null이됩니다.

DOM을로드 한 후 해당 스크립트 요소를 페이지 끝 부분에 넣어야합니다. 실제로 모든 스크립트를 문서 끝에 넣을 수 있습니다.

3) clear() 메서드 이름은 동일한 이름의 미리 정의 된 전역 심볼을 방해하므로 다른 함수 이름으로 변경해야합니다. 이것은 일반적으로 전역 적으로 범위가 지정된 기호를 피하려는 이유 중 하나입니다. http://jsfiddle.net/jfriend00/ZvbS6/

참고 :

는 다음 작업 데모의 당신은 일반 자바 스크립트를 사용하는 경우, 당신은 어떤 브라우저 차이점을 처리해야합니다. IE의 이전 버전은 e.preventDefault()을 지원하지 않습니다. 자세한 내용은 this prior answer을 참조하십시오.

출처

2013-12-22 20:02:38 jfriend00

hmm .. 나는 기본 검색을 사용하지 않도록 기본을 방지하는 방법을 잘 알고 있지 않으므로 반환 값을 false로 추가하면 그 결과도 알 수 있습니다. 그 이유는 .. 그게 왜 C++에서 나온 것인가하는 이유입니다. 자바 스크립트를 배우는 모든 소스 ?? – B0rn2C0de

@ B0rn2C0de - 어떻게 해야할지는 jsFiddle 작업 데모에서 모두 내 대답에 링크되어 있습니다. 네'return false'는 특별한 경우에도 작동합니다. – jfriend00

배열 자체 재설정 자바 스크립트

답변

관련 문제