일부 사용자 지정 기능을 클릭 이벤트를 포장하는 방법

Question

나는, 사용자 버튼을 클릭하면, 내가 사용하기 쉬운 경우 2 가지 확인

1. 아약스 호출을 어떻게 할 '프로젝트를 만듭니다'라는 버튼이 있습니다 허용되는 경우
2. 을 만든 다음 정상적으로 단추를 실행하고 그렇지 않으면 새 프로젝트를 만들 수 없다는 모달 대화 상자를 팝업합니다.

는 다음 코드를 그것이 무한 루프가 있기 때문에 작동하지 않습니다 위의 코드에서

$('.create_project').click(function(e) { 
    e.stopDefault(); 
    $.getJSON('/check_user_limit', function(data){ 
     if(data.allow_to_create_project){ 
      //trigger the click here 
     }else{ 
      //modal here 
     } 
    } 
}); 

사용하는 '트리거'를 가지고있다. 언 바인드는 처음에는 작동하지만 foo가 더 이상 함수에 바인드하지 않기 때문에 두 번째로는 작동하지 않습니다. 당신이 원하지 않는 이유

Answer 1

는 잘 모르겠어요 그냥 할 :

$('.foo').click(function(e) { 
    $(this).href = "/bar"; 
}); 

Answer 2

그것은, 당신은 다음과 같은 매우 간단 할 것 :

$('.foo').click(function(e) { 
    $(this).href = "/bar"; # done something else before the click 

    return true; 
}); 

당신이 클릭을 차단하려면 이벤트를 전파하고 전달하지 않으면 단순히 대신 false를 반환합니다. 나는 당신이 당신의 모범을 더 명백하게 만들었지 만, 그 해결책은 여전히 ​​다소 비슷하다. 이벤트를 전파하기 위해 true를 반환하는 대신 false를 반환하여 click 함수가 이벤트를 삼키도록하면서 클릭을 수동으로 트리거합니다. 코드는 다음과 같이 보일 것입니다 :

$('.create_project').click(function(e) { 
    $.getJSON('/check_user_limit', function(data) { 
     if (data.allow_to_create_project) { 
      e.click(); 
     } else { 
      //modal here 
     } 
    } 
    return false; 
}); 

그러나, 기능을 사용할 수 있는지 여부를 확인하는 AJAX 요청을하는 것은 일반적으로 좋은 생각이 아니다. 서버가 이미 사용자가 프로젝트를 만들 수 없다는 것을 이미 알고 있다면 버튼을 클릭 할 수있는 이유는 무엇입니까? 대신 적절한 상태로 컨트롤을 업데이트하십시오.

Answer 3

나는 혼란 스럽다. 언 바인딩을 언급했지만 실제 코드에서 이벤트의 실제 바인딩 해제는 없습니다.

요소의 일부 코드 사전 실행을 실행하려는 경우 잘못된 방향으로 진행됩니다.

$('.foo').click(function(e) 
{ 
    $(this).href = "/bar"; 
    return true; // this is implicit, but you could return false to cancel the event 
}); 

다른 작업을 수행하려는 경우 맞춤 이벤트 이름 인 두 개의 별도 이벤트를 사용하는 것이 좋습니다.

Answer 4

왜 클라이언트 측 코드가 좋을까요?

사용 편의성 측면에서 서버 쪽 코드로 사용자 권한을 확인하는 것이 좋으며 문제가있는 경우 페이지가로드 될 때까지 비활성화 된 단추 옆에 메시지가 표시됩니다. 이 메시지는이 사용자에 대한 프로젝트 생성을 가능하게하기 위해 수행 할 수있는 작업을 언급합니다.

때로는 특정 도구가 목적을 달성하는 데 필요한 경우라도 평가해야 할 때가 있습니다.