jquery에서 선택 필드의 유효성을 검사하는 방법은 무엇입니까?

Question

는이 코드가 있습니다

<form action="" id="credentials" method="post"> 
<label for="name" id="nameLabel" >Name*:</label> 
<input type="text" name="name" id="name" value="" /> 
<select id="single"> 
    <option value="0">Single</option> 
    <option value="1">Single2</option> 
</select> 
<input type="submit" value="Submit" name="" data-inline="true"/> 
</form> 

을 그리고는 다음과 같이 확인하기 위해 노력하고있어 :

$("#credentials").submit(function(e) { 
    var nameField = $("input#name").filter(function() { 
     return !$.trim(this.value).length; 
    }); 

    if (nameField.length) { 
     nameField.css("border", "1px solid red"); 
     alert("Name is missing!"); 

     return false; 
    } 

    var stateField = $("#single").val(); 

    if (stateField == 0) { 
     stateField.css("border", "1px solid red"); 
     alert("State is missing!"); 
     return false; 
    } 
}); 

입력이 잘 작동하지만, 선택하지. 어떤 아이디어? 여기에 a입니다 JSFiddle example

Answer 1

문제는 귀하의 stateField 변수가 필드의 실제 값을 보유하고 있다는 것입니다. 필드 자체 또는 필드에 대한 jQuery 객체에 대한 참조가 아니므로 stateField.css()을 말할 수 없습니다. 이 같은

시도 뭔가 : 오류 유효성 검사는 오직 하나의 오류를보고합니다을 발견하는 즉시 함수에서 반환하여 해당 http://jsfiddle.net/A6eEh/3/

참고 : 데모

var stateField = $("#single"); 

if (stateField.val() == 0) { 
    stateField.css("border", "1px solid red"); 
    alert("State is missing!"); 
    return false; 
} 

업데이트 버전 한 번에 (따라서 stateField 이름을 입력하지 않으면 유효성 검사가 발생하지 않습니다).

Answer 2

업데이트 jsfiddle : http://jsfiddle.net/A6eEh/2/

stateField는 실제 요소 값을하지 들고있다. 요소에 CSS를 적용해야합니다.