나는 우리 develepors 팀에서 아주 새롭습니다.
몇 가지 강력한 논증 및 / 또는 "함정"예제가 필요하므로, 상사는 눈에 거슬리지 않는 JavaScript의 장점을 마침내 이해하여 그와 팀의 다른 사람들이 다음과 같은 일을 중단하도록합니다.
<input type="button" class="bow-chicka-wow-wow"
onclick="send_some_ajax(); return false;" value="click me..." />
과
<script type="text/javascript">
function send_some_ajax()
{
// bunch of code ... BUT using jQuery !!!
}
</script>
나는 매우 일반적인 패턴을 사용하도록 제안했다.
<button id="ajaxer" type="button">click me...</button>과
<script type="text/javascript">
// since #ajaxer is also delivered via ajax, I bind events to document
// -> not the best practice but it's not the point....
$(document).on('click', '#ajaxer', function(ev) {
var $elem = $(this);
ev.preventDefault();
});
상사와 다른 사람들이이 접근법을 사용하고 싶지 않은 이유는 FireBug (또는 Chrome 개발자 도구)의 이벤트 검사가 더 이상 단순하지 않기 때문입니다.
<input type="text" name="somename" id="someid" onchange="performChange()">그는 변경 이벤트에서 어떤 기능이 실행되는지 즉시 확인할 수 있으며 spaghetti-code로 가득 찬 거대한 JS 파일 에서 바로 그 기능으로 바로 이동할 수 있습니다 .
눈에 잘 띄지 않는 JavaScript의 경우 그가 볼 수있는 유일한 것은 :
<input type="text" name="somename" id="someid" />그리고 어떤 이벤트가이 요소에 바인딩되어 있고 어떤 함수가 트리거되는지 알 수 없습니다.
나는 해결책을 찾고 있었고 그것을 발견했다.
$(document).data('events') // or .. $(document).data('events').click그러나이 "접근법"으로 인해 어떤 함수가 어떤 이벤트를 발생시키는 지 알아내는 데 "너무 오래 걸렸습니다 ..."라는 메시지가 나타 났으므로 바인딩 이벤트를 중지하라는 메시지가 나타납니다.
"UJS를 사용해야하는 이유"에 대한 몇 가지 예나 강력한 장점 또는 다른 제안을 요청합니다.
업데이트 : "작업 변경"에 대한 제안은 이상적인 솔루션이 아닙니다.
업데이트 2 : 좋아, jQuery 이벤트 바인딩을 사용하도록 제안했을뿐만 아니라 그렇게했다 . 모든 이벤트 위임을 작성한 후, 보스가 내게 와서 물어 보았습니다. 왜 다른 접근 방식과 접근 방식으로 이벤트 위임을하고 있는지 모르겠습니다.
나는 15 개의 입력 필드가 있고 모든 onchange이벤트가 있습니다 (일부 는 물론 이벤트도 있습니다 onkeyup) 모든 입력 필드에 대해 이러한 종류의 이벤트 위임을 작성하는 것이 더 실용적입니다. 특히 모든 HTML이 PHP의 에코로 렌더링되는 경우 15 번 수행하는 대신->echo '... <input type="text" id="someid" ... />...'
js-this-class-do-something클래스가 있으므로 코드에서 CTRL + F를 쉽게 수행 할 수 있습니다.