Search 버튼 클릭 이벤트

Question

내가 Enter를 누르면 멋지게 작동합니다. 그러나 나는 또한 텍스트 상자에서 searchbutton을 클릭하여 검색을 수행하고자합니다. 나는 oncommand 속성을 추가했으나 검색이 끝난 후 검색을 수행했습니다. 검색 버튼이 십자가로 변경되었습니다. 나는 그것을 다시 수행 한 십자가를 클릭했다. 그러나 설명서를 확인했지만 내 searchbutton click을 검색 이벤트와 연관시키는 방법에 대한 정보를 찾을 수 없었습니다. 사이드 노트

<textbox id="txt1" type="search" searchbutton="true" editable="true" 
    onkeypress="keyHandler(event);" /> 

Answer 1

먼저 다음 command 이벤트를 사용하여 항상 직접 클릭이나 키 입력을 처리하지 마십시오 -이 요소의 동작은 사용자가 기대하는 것과 일치 확인합니다.

<textbox type="search">은 동일한 검색을 두 번 수행하는 것이 의미가 없다고 가정합니다. 따라서 검색을 수행 한 후 검색 버튼이 십자 기호로 바뀌고 그 십자가를 클릭하십시오. 은 검색 텍스트를 지우고 새로운 command 이벤트를 발생시킵니다. 십자가를 클릭하는 대신 검색 텍스트를 변경하면 일반적인 검색 버튼이 다시 나타납니다. 따라서 command 처리기는 텍스트가 비어있는 경우 검색 결과를보아야합니다 (수동으로 또는 십자가를 눌러 검색 텍스트를 지우고 텍스트가 비어있는 경우 새 검색 수행).

Answer 2

이 해결책은 귀하의 문제에 해당되지 않을 수도 있지만 이것은 당신의 과제를 마무리 짓는 아이디어를 줄 것입니다.

XUL 텍스트 상자 :

<textbox id="textbox" type="search" oncommand="SearchKeyword(this)"/> 

JS :

function SearchKeyword(oElem) // Function for search for the characters 
     { 
     var filter = document.getElementById("textbox"); 
     filter.setAttribute("value", oElem.value); 
     document.getElementById("myTodoListTree").builder.rebuild(); 
     }