jQuery 비활성화 / 활성화 submit 버튼

 

질문 : jQuery 비활성화 / 활성화 제출 버튼

---

이 HTML이 있습니다.

<input type="text" name="textField" />
<input type="submit" value="send" />

다음과 같이 어떻게 할 수 있습니까?

• 텍스트 필드가 비어 있으면 제출을 비활성화해야합니다 (disabled = "disabled").
• 비활성화 된 속성을 제거하기 위해 텍스트 필드에 무언가를 입력 할 때.
• 텍스트 필드가 다시 비워지면 (텍스트가 삭제됨) 제출 버튼을 다시 비활성화해야합니다.

나는 다음과 같이 시도했다.

$(document).ready(function(){
    $('input[type="submit"]').attr('disabled','disabled');
    $('input[type="text"]').change(function(){
        if($(this).val != ''){
            $('input[type="submit"]').removeAttr('disabled');
        }
    });
});

… 그러나 작동하지 않습니다. 어떤 아이디어?

답변

---

문제는 포커스가 입력에서 멀어 질 때만 변경 이벤트가 발생한다는 것입니다 (예 : 누군가가 입력을 클릭하거나 탭에서 빠져 나옴). 대신 keyup을 사용해보십시오.

$(document).ready(function() {
     $(':input[type="submit"]').prop('disabled', true);
     $('input[type="text"]').keyup(function() {
        if($(this).val() != '') {
           $(':input[type="submit"]').prop('disabled', false);
        }
     });
 });

출처 : https://stackoverflow.com/questions/1594952/jquery-disable-enable-submit-button