모든 필드를 채우고 싶은 양식이 있습니다. 필드를 클릭한 후 입력하지 않으면 빨간색 배경을 표시하고 싶습니다.
다음은 제 코드입니다:
$('#apply-form input').blur(function () {
if ($('input:text').is(":empty")) {
$(this).parents('p').addClass('warning');
}
});
필드가 채워져 있는지 여부에 관계없이 경고 클래스를 적용합니다.
제가 뭘 잘못하고 있나요?
$('#apply-form input').blur(function()
{
if( !$(this).val() ) {
$(this).parents('p').addClass('warning');
}
});
그리고 빈 문자열은 어차피 거짓으로 평가되므로 '.length'가 반드시 필요하거나 '.0'인지 확인할 필요는 없지만 가독성을 위해 원할 경우 확인할 수 있습니다:
$('#apply-form input').blur(function()
{
if( $(this).val().length === 0 ) {
$(this).parents('p').addClass('warning');
}
});
항상 텍스트 필드 요소에서 작동하는 것이 확실하다면 this.value
를 사용하면 됩니다.
$('#apply-form input').blur(function()
{
if( !this.value ) {
$(this).parents('p').addClass('warning');
}
});
또한 $('input:text')
는 여러 요소를 가져오고, 컨텍스트를 지정하거나, 하나의 요소에 대한 참조만 원하는 경우 this
키워드를 사용해야 합니다(컨텍스트의 자손/자식에 하나의 텍스트 필드가 있는 경우).
Everybody has the right, I like to be a little more 명시성 및 트림합니다 것이 아니라 값.
$('#apply-form input').blur(function() {
if(!$.trim(this.value).length) { // zero-length string AFTER a trim
$(this).parents('p').addClass('warning');
}
});
& # 39 의 경우, 그 후, # 39, 0& 엔트리입니다 트렌크스 사용하지 않습니다. bad, and 로 표시된 엔트리입니다 플래깅된 얻을 수 있는 공간 없이 5$ 스트림 확인을 받을 수도 있다. Best of 운빨이야.
그렇게 켜짐이 흐림의 너무 제한적이다. 있었다, 그래서 내가 직접 해야 하는 필드이므로 간주합니다 강조하십시오 양식 제출을 통해, 맵 입력입니다. 몇 년 후 계속 요령 등을 처리하는 데 있어 더 많은 것을 제공할 것이라고 돌림무늬 흐림의 간단해진다는 어디에 들려주시겠습니까?
$('#signupform').submit(function() {
var errors = 0;
$("#signupform :input").map(function(){
if( !$(this).val() ) {
$(this).parents('td').addClass('warning');
errors++;
} else if ($(this).val()) {
$(this).parents('td').removeClass('warning');
}
});
if(errors > 0){
$('#errorwarn').text("All fields are required");
return false;
}
// do the ajax..
});
또한 사용할 수 있습니다.
$('#apply-form input').blur(function()
{
if( $(this).val() == '' ) {
$(this).parents('p').addClass('warning');
}
});
관하여 경우 공백 후 노력하잖니
$('#apply-form input').blur(function()
{
if( $(this).val().trim() == '' ) {
$(this).parents('p').addClass('warning');
}
});
포함한다 검증 플러그인에는 대신 사용하는 것이 좋습니다. 수 있을 정도로 성숙한 처리하는 경우가 있으나, 이는 단순한 필수 필드 약간 오버킬 모서리까지 너회가 haven& # 39, t (disk_b_s10database 아니하였으매 때까지 우리는 그 어느 누구도 실행했음 agent.) 오갔다는 아직.
태그 필수 항목 수신기마다 수준의 " required" 실행하십시오 수 있습니다. (& # 39, form& # 39;), a $ $ (document) 그레이디 () 와 that& 스발리다테 () 에 있는 모든 # 39 에 걸린다.
한가지 더 생각해 보는 것은 없다고 할 수 있습니다, 현재 이 추가 할 수 있을 때 다시 분리에 대한 경고 클래스용 비어 있는 경우에는 더 이상 어떻게 클래스 양식 비어 있지 않습니다.
다음과 같습니다.
$('#apply-form input').blur(function()
{
if( !$(this).val() ) {
$(this).parents('p').addClass('warning');
} else if ($(this).val()) {
$(this).parents('p').removeClass('warning');
}
});
다음은 키우프 사용한 예는 선택한 입력입니다. It 는 물론 트리밍할 있는지 확인하기 위해 일련의 그냥 공백 문자 # 39, t 트리거하지 doesn& 트루시 반응을 보였다. 이 예는 prepress 확인란 또는 해당 유형의 관련된 일을 시작하기 위해 사용할 수 있는 기능을 제공합니다.
YourObjNameSpace.yourJqueryInputElement.keyup(function (e){
if($.trim($(this).val())){
// trimmed value is truthy meaning real characters are entered
}else{
// trimmed value is falsey meaning empty input excluding just whitespace characters
}
}
$(function() {
var fields = $('#search_form').serializeArray();
is_blank = true;
for (var i = 0; i < fields.length; i++) {
// excluded fields
if ((fields[i].name != "locale") && (fields[i].name != "utf8")) {
if (fields[i].value) {
is_blank = false;
}
}
}
if (is_blank) {
$('#filters-button').append(': OFF');
}
else {
$('#filters-button').append(': ON');
}
});
모든 필드는 비어 있고 덮어쓰기/추가 ON / OFF on Filter_button 있는지 확인하십시오.
또한, 이 질문에 대한 추가 할 수 있는 큰 취합은 싶다 '' 자리표시자 표시됩니까 사용하여 css 선택기를. 조금 더 사용할 경우 이미 사용하고 있고, 특히 you& IMO # 39, re jQ 자리표시자 따라 투입물.
<! - begin 스니핏: js 숨기십시오: 거짓값 콘솔: 진정한 바벨. > 거짓값 -;
if ($('input#cust-descrip').is(':placeholder-shown')) {
console.log('Empty');
}
$('input#cust-descrip').on('blur', '', function(ev) {
if (!$('input#cust-descrip').is(':placeholder-shown')) {
console.log('Has Text!');
}
else {
console.log('Empty!');
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" class="form-control" id="cust-descrip" autocomplete="off" placeholder="Description">
끝 - < 스니핏 >;!
또한 '유효함 잘못된 활용할 경우' 와 '의 선택기는 투입물 필요합니다. 이러한 선택기를 사용할 수 있습니다 사용할 경우 필요한 속성 협력하였습니다 입력입니다.