使用Specefic类循环表单元素

Question

其实我正在验证具有文本，选择，下拉等字段的表单。我有一些强制性的领域，我给他们一个需要的类（只有文本域）。现在，我想遍历所有表单元素，并检查该元素是否具有所需的类，然后在该字段后附加*。我已经使用each（）方法，但是我没有完全按照我想要的方式工作。

我的代码如下所示：

function validate_form() { 
    $("#mysubmit").each(function() { 
     if($("form :text.required:text").val() == "") 
     { 
      $("form :text.required:text").html("*"); 
      return false; 
     } 
     return true; 
    }); 
} 

其中mysubmit是我的提交按钮的ID。

我想逐个遍历DOM元素。任何人都可以帮助我如何验证此表单。 感谢

Answer 1

可以使用.after为所需的元素后追加*，像这样：

$('.required').after('<span>*</span>'); 

用于遍历所有必填字段，你这样做：

$(.required).each(function(){ 
    //do something with this 
    //inside this function 'this' is in turn each of the selected elements 
    alert($(this).val()); 
}); 

jQuery.each遍历它所应用的选择中的所有元素。在你的情况下，$("#mysubmit")只是一个元素（我假设提交按钮）。没有必要。
这里是你的代码的重写版本：

function validate_form() { 
    var valid = true; 
    $('form .required').each(function(){ 
     if ($(this).val()==''){ 
     $(this).after('<span>*</span>'); 
     valid = false; 
     } 
    }); 
    return valid; 
} 

注：

• 没有必要$("#mysubmit").each为你的函数内部的逻辑不依赖于提交按钮
• 返回一个像你试过的.each函数的值不能像你期望的那样工作。如果您从.each函数返回false，则它将停止迭代。
• $（“form：text.required：text”）将匹配全部具有类.required的文本字段，而不仅仅是一个，正如您所期待的那样。

Answer 2

正如你所说，你想追加的'*'。您试图在内插入。

我们将创建class="validation"跨度不喜欢这样写道：

function validate_form() { 
    var valid = true; 
    $('form .required:text').each(function(){ 
     var $spanVal = $(this).next(); //Try to get the validation message (who has '*') 
     if ($(this).val()!="" && $spanVal.is("span.validation")){ //If text has value 
      $spanVal.remove(); //remove the asterisk 
     }else if($(this).val()==""){ //If text is empty   
      if(!$spanVal.is("span.validation")){ //Create a validation message if it doesn't exist 
       $('<span class="validation">*</span>').insertAfter(this); 
      } 
      valid = false; 
     } 
    }); 
    return valid; 
} 

希望这有助于。干杯。

Answer 3

这是我如何解决我的问题，而

if语句删除警报和.append的* :)觉得它应该工作

https://stackoverflow.com/a/40891000/5185974