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; 
});