0

我有这个表格：

<form>
<fieldset>
<legend>Address Information</legend>

<div>
<label for="country">Country:</label> <span id="country-list">
<select name="country" class="required">
<option value="0">Please Select</option>
<option value="1">Afghanistan</option>
<option value="2">Albania</option>
<option value="3">Algeria</option>
<option value="4">American Samoa</option>
</select>&nbsp;</span>
<span class="error_msg" style="display: none; ">
<br><label for="space">&nbsp;</label>Please select your country.</span>
</div>

<div>
<label for="street-address">Street Address:</label> <input type="text" id="street_address" name="street_address" value="" size="50" class="required">
<span class="error_msg" style="display: inline; "><br><label for="space">&nbsp;</label>Please enter your accurate street address (at least 7 characters)</span>
</div>

<div>
<label for="suburb">Suburb:</label> <input type="text" name="suburb" value="" class="required">
</div>

<div>
<label for="city">City:</label> <input type="text" id="city" name="city" value="" class="required">
<span class="error_msg" style="display: inline; "><br><label for="space">&nbsp;</label>Please enter your city (at least 4 characters)</span>
</div>

<div>
<label for="post-code">Post Code:</label> <input type="text" id="postcode" name="postcode" value="" class="required">
<span class="error_msg" style="display: inline; "><br><label for="space">&nbsp;</label>Please enter your postal code (at least 3 characters)</span>
</div>

</fieldset>
</form>

我在下面有一个 jquery 函数，当单击提交时，它只检查input text fields但不检查选择字段。如果字段有值，它将返回 true，如果字段没有值，它将返回 false。

function ValidateForm()
{
   jQuery('span.error_msg').hide();
   var success = true;

     jQuery("#shippingF .required").each(function()
        {
            if(jQuery(this).val().length <= 2)
            {
                jQuery(this).next().show();
                success = false;
            }
     });

    return success;
}

如何在这个简单的验证功能中包含选择字段？

4

2 回答 2

0

好的，对不起，我被原始代码中的一些错误吓倒了，这是最终的工作版本

function ValidateForm()
{
 jQuery('span.error_msg').hide();
 var success = true;

 if($('select[name=country]').val() == '0'){
   success = false;
  }
     jQuery(".required").each(function()
      {
        if(jQuery(this).val().length <= 2)
        {alert(jQuery(this).val().length);
            jQuery(this).next().show();
            success = false;
        }
 });

return success;
}

关于原始代码的几点说明：

  1. 找不到选择器 ID shippingF，所以我必须删除它并按类引用.required，如果你在层次结构中的某个地方定义它，那么它应该没问题

  2. 从 select 元素中删除了该类.required，因此它不会包含在您的每个循环中。这将始终返回 1 并导致您的 if 语句if(jQuery(this).val().length <= 2) 失败。

这是一个工作小提琴

于 2012-09-18T03:25:46.487 回答
0

您可以在循环中包含另一个评估并检查它是否是一个选择：

function ValidateForm()
{

   jQuery('span.error_msg').hide();
   var success = true;

   jQuery("#shippingF .required").each(function()
   {

       if(jQuery(this).hasClass('select')) {
          if(jQuery(this).val() == 0) {
             success = false;
          }
       } else {
          if(jQuery(this).val().length <= 2) {
             jQuery(this).next().show();
             success = false;
          }
       }
   });
   return success;
}

类似的东西。

于 2012-09-18T03:33:00.357 回答