Question

我有一个表单，我希望它使用我的方法validateForm（）使用jQuery进行验证：

function validateForm() {
var count = 0;

$("input[type='text']").each(function () {
    if ($(this).id == "AbdominalCircumferencetext") {
        if ($("#AbdominalCircumferencetext").val() == "" || ($("#AbdominalCircumferenceradio").val().length == 0)) {
            ($("#AbdominalCircumferencetext").css("border", "2px solid red"));
            ($("#AbdominalCircumferenceradio").css("border", "2px solid red"));
            count++;
        }
    }
    if ($(this).val() == "") {
        $(this).css("border", "2px solid red");

        count++;
    }
    else {
        $(this).css("border", "");
    }

});

var checkboxGroupNames = [];

$(':radio').each(function () {
    var nameOfCheckBoxGroup = $(this).attr('name');
    var nameExistInList = jQuery.inArray(nameOfCheckBoxGroup, checkboxGroupNames);
    if (nameExistInList < 0) {
        checkboxGroupNames.push(nameOfCheckBoxGroup);
    }
});

   var counter = 0;
var counts = 0;
$.each(checkboxGroupNames, function () {
    if ( $("input[name='" + checkboxGroupNames[counter] + "']:checked").length === 0) {
        $("#" + checkboxGroupNames[counter] + "radio").css("border", "2px solid red");
        counts++;
    } 
    else {
        $("#" + checkboxGroupNames[counter] + "radio").css("border", "");
    }
    counter++;





});
if (counts == 0 && count == 0) {
    return true;
} else {
    alert("Du måste fylla i alla rutorna samt välja något alternativ av radioknapparna!");
    return false;
}

}

问题是我想对没有值的每个textfield或radiobutton进行计数。因此，每次边框设置为红色时，它都没有值，在这种情况下，我想在代码中进行计数。然后在代码完成所有文本框和单选按钮之后我想要查看是否有任何失败。但我不能在我的代码结束时进行计数。它说这将永远是真的。如果有更好的方法来做到这一点？或者我是以正确的方式做到这一点，但我的语法或错误？

Answer 1

你的代码似乎有点“到处都是”。如果你有一个包含三个名为“count”，“counter”和“count”的变量的函数，你应该觉得你的方向是错误的：）

如果我已正确理解您的代码，您只想检查没有类型文本的输入为空并且选中所有单选按钮选项。如果是这样的话，我会像这样写http://jsbin.com/iluquz/4/edit

function validateForm() {

var isMissingAnswer = false,
  radioButtons = [];

// Go through inputs in form
$('input:not([type="submit"])').each(function() {

    // Collect radio button names
    if( this.type == 'radio' ) {
      if( $.inArray(this.name, radioButtons) == -1 ) {
        radioButtons.push(this.name);
      }
    }

    // Check if answer is given
    else {
      if( this.value == '' ) {
        $(this).css('border', 'red solid 2px');
        isMissingAnswer = true;
      } else {
        $(this).css('border', '');
      }            
    }        
});

// Go through radio buttons and make sure they're checked
$.each(radioButtons, function(i, name) {
    var $radioButtons = $('input[name="'+name+'"]');
    if( $radioButtons.filter(':checked').length == 0 ) {
      $radioButtons.parent().css('border', 'red solid 2px');
      isMissingAnswer = true;
    } else {
      $radioButtons.parent().css('border', '');
    }
});

if( isMissingAnswer ) {
    alert("Du måste fylla i alla rutorna samt välja något alternativ av radioknapparna!");
    return false;
} else {
    alert('Allt gick bra :)');
    return true;
}

}

验证表单的方法

1 个答案: