이전 텍스트를 제거하고 자바 스크립트 innerHTML을 사용하여 새로 표시

Question

사용자로부터 입력을 받고 일치하는 결과를 표시하고 있습니다. 따라서 사용자가 'a'를 입력하면 다음 텍스트가 표시됩니다. 축구 야구 빠름 a ('다음') 뒤에 사용자가 입력하는 경우. 다음 텍스트가 표시됩니다 축구 야구 빠른 야구 빠릅니다. 하지만 사용자가 입력 할 때 처음 세 가지 결과를 제거하고 싶습니다.

// JavaScript Document 

s1= new String() 
s2= new String() 
var myArray = new Array(); 

myArray[0] = "Football"; 
myArray[1] = "Baseball"; 
myArray[2] = "Cricket"; 
myArray[3] = "Fast"; 


function test() // called on onkeyup() 
{ 
s1 = document.getElementById('filter').value; 
var myRegex = new RegExp((s1),"ig"); 
arraysearch(myRegex); 
} 

function arraysearch(myRegex) 
{ 

for(i=0; i<myArray.length; i++) 
{ 
if (myArray[i].match(myRegex)) 
{ 
    document.getElementById('placeholder').innerHTML += myArray[i] + "<br/>"; 
} 
} 
} 

Answer 1

이 함수 당신이 먼저 자리 innerHTML을을 재설정해야 arraysearch(myRegex)

Answer 2

당신이하고있는 일은 이전 목록에 새 목록을 추가하는 것입니다. 대체하지 않을 것입니다. 이 함께 루프의 마지막을 교체하십시오 :

var newHtml; 
for(i=0; i<myArray.length; i++) 
{ 
if (myArray[i].match(myRegex)) 
{ 
    newHtml += myArray[i] + "<br/>"; 
} 
} 
document.getElementById('placeholder').innerHTML = newHtml; 

Answer 3

에 첫 번째 줄 document.getElementById('placeholder').innerHTML="";을 추가합니다. 다음은 작동 예제입니다. http://jsfiddle.net/HW6fF/

thePlaceholder = document.getElementById('placeholder'); 
function arraysearch(myRegex) { 
    thePlaceholder.innerHTML = ""; 
    for(i=0; i<myArray.length; i++) { 
     if (myArray[i].match(myRegex)) { 
     thePlaceholder.innerHTML += myArray[i] + "<br/>"; 
     } 
    } 
}​