MVC에서 jquery를 사용하여 암호 필드에 CSS 클래스를 추가하는 방법은 무엇입니까?

이 내가 이런 식으로 시도에 onblur 기능 이 암호 필드에 CSS 클래스를 추가 할 비밀번호 필드MVC에서 jquery를 사용하여 암호 필드에 CSS 클래스를 추가하는 방법은 무엇입니까?

@Html.Password("confPwd", null, new { @class = "form-control", @id = "confrimPwd", @placeholder = @Resources.ConfirmPwd , @onchange = "changeBorder()"})

입니다. 그러나 그것은 작동하지 않습니다. 내가 이것을 텍스트 필드에 적용 할 때. Passwordfield의 경계를 어떻게 바꿀 수 있습니까?

function changeBorder() { 

     if ($("#confrimPwd").val().length != 0) { 
      $("#confrimPwd").addClass('successClass'); 
     } 
     else { 
      $("#confrimPwd").addClass('errorClass'); 
     } 

    }

이것은 내 CSS 클래스입니다.

.errorClass { 
     border: 1px solid #B94A48; 
    } 

    .successClass { 
     border: 1px solid #CCCCCC; 
    }

출처

2014-01-25 user2901979

작동하지 않는다고해서 무엇을 의미합니까? 클래스가 추가되었지만 경계 만 표시되거나 추가 된 클래스가 없습니다. –

예. addign 클래스 이후에 표시되지 않음 – user2901979

.errorClass 및 .successClass는 어디에 저장되어 있습니까? 모든보기 또는 일부 다른 CSS 파일에서 사용할 수있는 기본 CSS 파일에서? Firebug 또는 코드를 삽입하기위한 브라우저 도구를 사용하여 코드를 프로파일 링 했습니까? –

나는 당신이 암호 필드에 마우스 커서를 놓고 값을 입력하지 않고 떠날 때 그런 다음, 다음은 빨간색 테두리가 표시됩니다

@Html.Password("confPwd", null, new { @class = "form-control", @id = "confrimPwd", @onfocusout = "changeBorder()" })

onfocusout 처리 할 필요가 있다고 생각합니다. 그리고 어떤 가치를 입력하고 집중하면 회색 테두리가 생깁니다.

또한 CSS 클래스를 추가하는 것이 더 좋습니다. 당신이 어떤 값을 입력하지 않고 초점

function changeBorder() { 
    if ($("#confrimPwd").val().length != 0) { 
     $("#confrimPwd").removeClass('errorClass'); 
     $("#confrimPwd").addClass('successClass'); 
    } 
    else { 
     $("#confrimPwd").removeClass('successClass'); 
     $("#confrimPwd").addClass('errorClass'); 
    } 

}

enter image description here

당신이 어떤 가치를 추가하고 초점이 -

enter image description here

PS를 - 테스트 목적을 위해, I 모든 스타일, 스크립트 및 HTML을 단일보기에 배치하고 테스트했습니다. 실제로 JQuery가 제대로 참조되는지 여부를 확인해야 할 수도 있습니다. 또한 스크립트와 스타일이 제대로 참조되었는지 확인해야합니다. 좋은 방법은 크롬의 F12 개발자 도구를 사용하여 모든 것이 올바르게로드되었는지 확인하는 것입니다.

출처

2014-01-25 10:51:13 ramiramilu

MVC에서 jquery를 사용하여 암호 필드에 CSS 클래스를 추가하는 방법은 무엇입니까?

답변

관련 문제