텍스트 필드를 기반으로 버튼 색상을 변경하십시오.

-1

저는 현재 작업중인 MVC 4 응용 프로그램이 있습니다. 페이지 중 하나는 사용자 이름과 비밀번호를위한 2 개의 텍스트 필드가있는 로그인 페이지입니다. 페이지 하단에 제출 버튼이 있습니다. 나는 이미 단추를 위해 설정 한 스타일링을 가지고 있는데, 버튼을 내 회색 색상으로 만들려고합니다. 텍스트 필드에 값이있을 때 텍스트 필드에 아무 것도 없을 때 설정했습니다. , 버튼의 색상이 바뀝니다. JavaScript로 어떻게 이것을 할 수 있습니까? 다음은 시도한 내용입니다. 다만 오류가 발생합니다.텍스트 필드를 기반으로 버튼 색상을 변경하십시오.

$(document).ready(function() { 
    $("#uName, #pWord").value(function() { 
     if ($("#uName, #pWord").is(null)) { 
      $("#submitBtnNormal").removeClass('on'); 
     } else { 
      $("#submitBtnNormal").addClass('on'); 
     }; 
    }); 
});

사전에 도움을 주셔서 감사합니다! 나는 JS에별로 좋지 않다.

출처

2013-12-13 Skrubb

사용은 어떤 이벤트가 없습니다이

$(document).ready(function() { 
    $("#uName, #pWord").change(function() { 
     if (!$("#uName").val().length && !$("#pWord").val().length) { 
      $("#submitBtnNormal").removeClass('on'); 
     } else { 
      $("#submitBtnNormal").addClass('on'); 
     }; 
    }); 
});

는 value을했다. 입력 필드의 텍스트를 편집 할 때 발생하는 이벤트 change을 캡처하려고합니다.

출처

2013-12-13 16:18:57 Krishna

내가 uName의와 PWORD와 사업부 레이블을해야하거나 내가 설정해야 할 수행 @ Html.EditorFor (model => model.Username, new {id = "uName"})와 pWord에 대해서도 마찬가지입니까? – Skrubb

@Skrubb - 입력 텍스트 필드에는 div가 아닌 해당 ID가 있어야합니다. – Krishna

먼저 사용하려는 방법은 value이 아니라 val입니다. 둘째, keyup과 같은 이벤트에서 코드를 실행해야합니다. 이 시도 :

$(document).ready(function() { 
    $("#uName, #pWord").keyup(function() { 
     if (!$("#uName").val() || !$("#pWord").val()) { 
      $("#submitBtnNormal").removeClass('on'); 
     } else { 
      $("#submitBtnNormal").addClass('on'); 
     }; 
    }); 
});

출처

2013-12-13 16:20:34

이 시도,

JS 스크립트

$(document).ready(function() { 
    $("#uName, #pWord").change(function() { 
     if ($("#uName").val()!='' && $("#pWord").val()!='') { 

      $("#submitBtnNormal").removeClass('on'); 
     } else { 
      $("#submitBtnNormal").addClass('on'); 
     }; 
    }); 
});

에게

DEMO

출처

2013-12-13 16:26:31 anand4tech

텍스트 필드를 기반으로 버튼 색상을 변경하십시오.

답변

관련 문제