텍스트 영역과 제출 버튼이 있습니다. 사용자가 텍스트 영역 외부를 클릭하면 스크립트가 실행되고 텍스트 영역에 아무것도없는 경우 제출 버튼이 표시되지 않습니다. 그러나 제출 버튼을 클릭하면 액션이 실행되고 버튼이 숨겨지기 때문에 텍스트 영역 외부를 클릭하는 것은 원치 않습니다. 그것은해서는 안된다. 그래서 사용자가 텍스트 영역의 래퍼 div 외부를 클릭하고 버튼을 제출하고 스크립트를 실행할 때를 감지해야합니다.사용자가 텍스트 영역 외부를 클릭했지만 요소 외부를 클릭하지 않았을 때 감지합니다.
<div class="wrapper">
<textarea class="textarea"></textarea>
<input type="submit" class="submit" value="submit"/>
</div>
확인 실제로 클릭 된 요소를 알려줍니다 사건의 '대상'속성. 그런 다음 제출 단추가 이벤트를 전달하지 않았는지 확인하기 위해 조건문을 사용할 수 있습니다.
의 jQuery 문서 : http://api.jquery.com/event.target/
모질라 문서 :이 같은 https://developer.mozilla.org/en-US/docs/DOM/event.target
뭔가 :
문서까지 이벤트 거품을 클릭 명심이다$(document).ready(function() {
var $text = $("textarea.textarea"),
$btn = $("input.submit");
$(document).click(function(e) {
if (!$text.is(e.target) && !$btn.is(e.target) && $text.val() == "")
$btn.hide();
else
$btn.show();
});
});
하지만 당신은 여전히 확인할 수 있습니다 원래 클릭 된 요소가 event.target이고, 문서가 수신하는 모든 클릭 이벤트에서 클릭이 텍스트 영역이나 버튼이 아닌 다른 곳에 있는지 테스트하고, 그렇다면 텍스트 영역이 e 버튼을 숨기고 그렇지 않으면 표시하십시오.
데모 : 개별 컨트롤을 식별하는 클래스를 사용하여 그 ID가 무엇인지의 가장 좋은 계획이 아니라고 http://jsfiddle.net/HpmDF/
참고. 하나 이상의 텍스트 영역과 관련 버튼이있을 수 있다면 다른 해결책이 필요합니다.
P. 또한 "클릭"에 대해 명시 적으로 물어 봤는데 내가 제공 한 내용이지만 키보드를 통해 사용자 탭을 허용해야합니다.