JQuery验证表单不提交

Question

我有一个表单，我在我的网站上使用它，并验证了一些简单的JQuery验证。问题是，当我更改值时，它并没有提交或做任何事情。这里是我的代码：

<form id="radForm" method="post" action="events.php?type=rad"> 
    <div class="searchBoxLeft searchBoxRad"></div> 
    <div class="searchBoxMiddle"> 
     <input id="radSearch" type="text" class="searchBoxInput searchBoxShort" value="<?php echo $yourradius; ?>" /> 
     <label class="searchBoxLabel">Mile Radius of Your Address</label> 
    </div> 
    <div id="radButton" class="searchBoxRight"></div> 
    <div class="clearLeft"></div> 
</form> 

<script> 
    $(document).ready(function() 
    { 
     var radsearchok = 0; 
     //Rad search 
     $('#radSearch').blur(function() 
     { 
      var radsearch=$("#radSearch").val(); 
      if(radsearch < 2){ 
       $('#radSearch').addClass("searchError"); 
       radsearchok = 0; 
      } 
      else if(radsearch > 50){ 
       $('#radSearch').addClass("searchError"); 
       radsearchok = 0; 
      } 
      else{ 
       $('#radSearch').addClass("searchSuccess"); 
       radsearchok = 1; 
      } 
     }); 
     // Submit button action 
     $('#radButton').click(function() 
     { 
      if(radsearchok == 1) 
      {    
       $("#radForm").submit(); 
      } 
      else 
      { 
       $('#radSearch').addClass("searchError"); 
      } 
      return false; 
     }); 
     //End 
    }); 
</script> 

任何人都可以看到什么是错的呢？

Answer 1

您需要返回并重新设置窗体的.val（）属性，否则将采用.val（）的原始值不是radsearch;

不知道你是否真的想更新.val（），或者只是附加一个属性。一些选项：

就在.blur的大括号之前 - >}）;加上”

$("#radSearch").val(radsearch);

或者：

添加一个隐藏的输入到您的形式与新的ID，如：

<input type='hidden' name='radsearchHidden' />

，然后.blur结束前做同样的：

$("#radsearchHidden").val(radsearch);

Answer 2

我做了一些改动你的代码（http://jsfiddle.net/zdeZ2/2/），我会在下面说明：

<div id="radButton" class="searchBoxRight"></div>我假设你有东西在里面=><input id="radButton" class="searchBoxRight" type="button" value="rad button">

我改写了你的验证与模糊如下。正如所建议的那样，在比较之前它将radSearch值校正为一个整数。更改在验证之前删除searchError和searchSuccess类。我也为你做了一些优化。

//Rad search 
$('#radSearch').blur(function() { 
    //remove classes from previous validating 
    var $this = $(this).removeClass("searchError").removeClass("searchSuccess"); 
    var radsearch = $this.val() | 0; //radsearch is an integer 
    if (radsearch < 2 || radsearch > 50) { 
     $this.addClass("searchError"); 
     radsearchok = 0; 
    } else { 
     $this.addClass("searchSuccess"); 
     radsearchok = 1; 
    } 
}); 

可以等效写成：

//Rad search 
$('#radSearch').blur(function() { 
    var $this = $(this); 
    var radsearch = $("#radSearch").val() | 0; //radsearch is an integer 
    var valid = radsearch < 2 || radsearch > 50; 

    $this.toggleClass("searchError", !valid) 
     .toggleClass("searchSuccess", valid); 
    radsearchchok = valid ? 1 : 0; 
});