2017-10-12 1 views
2

안녕하세요 저는 매번 어떤 검증 입력이 여기 내 실제 코드거기에 하나의 키를 제외하고 keyup 이벤트를 구현하는 방법은 무엇입니까?

\t \t \t function myFunction() { 
 
\t \t \t \t var input, filter, table, tr, td, i; 
 
\t \t \t \t var cpt = 0; 
 
\t \t \t \t var nbRow = 0; 
 
\t \t \t \t input = document.getElementById("filterInput"); 
 
\t \t \t \t filter = input.value.toUpperCase(); 
 
\t \t \t \t table = document.getElementById("test"); 
 
\t \t \t \t thead = table.getElementsByTagName("tbody"); 
 
\t \t \t \t tr = table.getElementsByTagName("tr"); 
 

 
\t \t \t \t for (i = 0; i < tr.length; i++) { 
 
\t \t \t \t \t td = tr[i].getElementsByTagName("td")[2]; 
 

 
\t \t \t \t \t if (td) { 
 
\t \t \t \t \t \t nbRow = nbRow + 1; 
 
\t \t \t \t \t \t if (td.innerHTML.toUpperCase().indexOf(filter) > -1) { 
 
\t \t \t \t \t \t \t tr[i].style.display = ""; 
 
\t \t \t \t \t \t } else { 
 
\t \t \t \t \t \t \t tr[i].style.display = "none"; 
 
\t \t \t \t \t \t \t cpt = cpt + 1; 
 

 
\t \t \t \t \t \t } 
 
\t \t \t \t \t } 
 
\t \t \t \t } 
 
\t \t \t \t if (nbRow == cpt) { 
 
alert("The list is empty") 
 
\t \t \t \t } 
 
\t \t \t }
<input id="filterInput" onkeyup="myFunction()"> 
 
<table id="test"> 
 
<thead> 
 
<tr> 
 
<th>Titre1</th> 
 
<th>Titre2</th> 
 
<th>Titre3</th> 
 
</tr> 
 
</thead> 
 
<tbody> 
 
<tr> 
 
<td>contenu1</td> 
 
<td>contenu2</td> 
 
<td>contenu3</td> 
 
</tr> 
 
</tbody> 
 

 
</table>
입니다 내부에 우리가 입력 한 내용 삭제하는 경우를 제외하고 입력 변화를 (내가 이벤트를 onKeyUp에 사용하고) 어떻게 자바 스크립트 기능을 개발하기 위해 노력하고있어

사용자가 한 문자를 삭제할 때마다 반복적 인 alert이 표시되지 않도록하려면 어떻게해야합니까?

편집 :

내가 한 문자를 삭제 사용자 후 검증을 잃지 않고 반복적 인 '경고'를 피하기 위해 노력하고있어. 물론

당신은 키를 누른 함수 검출의 확인을 구현할 수
+0

[Simple throttle in js] (https://stackoverflow.com/questions/27078285/simple-throttle-in-js) 중복 가능성 있음 –

답변

3

onkeyup을 사용하여 삭제 및 백 스페이스를 무시하려면이 체크를 함수 시작 부분에 추가하십시오.

function myFunction(event) { 
    // capture what key was pressed 
    var key = event.keyCode || event.charCode; 

    if(key === 8 || key === 46) 
     return; //if it's del or backspace, exit the function 

    // continue your function here 
} 
1

...

function myFunction(e) { 
 
    if(e.keyCode !== 8){ // back key excluded 
 
     var input, filter, table, tr, td, i; 
 
\t \t \t \t var cpt = 0; 
 
\t \t \t \t var nbRow = 0; 
 
\t \t \t \t input = document.getElementById("filterInput"); 
 
\t \t \t \t filter = input.value.toUpperCase(); 
 
\t \t \t \t table = document.getElementById("test"); 
 
\t \t \t \t thead = table.getElementsByTagName("tbody"); 
 
\t \t \t \t tr = table.getElementsByTagName("tr"); 
 

 
\t \t \t \t for (i = 0; i < tr.length; i++) { 
 
\t \t \t \t \t td = tr[i].getElementsByTagName("td")[2]; 
 

 
\t \t \t \t \t if (td) { 
 
\t \t \t \t \t \t nbRow = nbRow + 1; 
 
\t \t \t \t \t \t if (td.innerHTML.toUpperCase().indexOf(filter) > -1) { 
 
\t \t \t \t \t \t \t tr[i].style.display = ""; 
 
\t \t \t \t \t \t } else { 
 
\t \t \t \t \t \t \t tr[i].style.display = "none"; 
 
\t \t \t \t \t \t \t cpt = cpt + 1; 
 

 
\t \t \t \t \t \t } 
 
\t \t \t \t \t } 
 
\t \t \t \t } 
 
\t \t \t \t if (nbRow == cpt) { 
 
alert("The list is empty") 
 
\t \t \t \t } 
 
    } 
 
\t \t \t \t 
 
}
<input id="filterInput" onkeyup="myFunction(event)"> 
 
<table id="test"> 
 
<thead> 
 
<tr> 
 
<th>Titre1</th> 
 
<th>Titre2</th> 
 
<th>Titre3</th> 
 
</tr> 
 
</thead> 
 
<tbody> 
 
<tr> 
 
<td>contenu1</td> 
 
<td>contenu2</td> 
 
<td>contenu3</td> 
 
</tr> 
 
</tbody> 
 

 
</table>

당신은 당신이

을 제외 할 모든 키에 대한 코드를 추가해야
+0

휴대 기기에서 문제가 발생할 가능성이 있습니다. 마지막 이벤트의 문자열 길이를 더 잘 검사 할 수 있습니다. –

+0

모바일 용 Firefox에서 잘 작동합니다! 왜 그렇게 생각하지 않니? –

+0

간단하고 효율적입니다! 한 가지만하면 삭제하면 인증을 잃게됩니다! –

관련 문제