jquery通過KeyUp運行函數而不是提交

我有這段代碼檢查一個url是否是一個有效的url。jquery通過KeyUp運行函數而不是提交

現在檢查是通過按下按鈕完成的。但是我想擺脫這個按鈕，而只是在用戶在文本框中鍵入內容或鍵入內容時進行檢查。

我該如何做到這一點？我完全不熟悉jquery。

<script src="http://code.jquery.com/jquery-latest.js"></script> 
    <script type="text/javascript" src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script> 
<script type="text/javascript"> 
jQuery.validator.setDefaults({ 
    debug: true, 
    success: "valid" 
});; 
</script> 

    <script> 
    $(document).ready(function(){ 
    $("#myform").validate({ 
    rules: { 
    field: { 
     required: true, 
     url: true 
    } 
    } 
}); 
    }); 
    </script> 
    <style>#field { margin-left: .5em; float: left; } 
    #field, label { float: left; font-family: Arial, Helvetica, sans-serif; font-size: small; } 
    br { clear: both; } 
    input { border: 1px solid black; margin-bottom: .5em; } 
    input.error { border: 1px solid red; } 
    label.error { 
     background: url('http://dev.jquery.com/view/trunk/plugins/validate/demo/images/unchecked.gif') no-repeat; 
     padding-left: 16px; 
     margin-left: .3em; 
    } 
    label.valid { 
     background: url('http://dev.jquery.com/view/trunk/plugins/validate/demo/images/checked.gif') no-repeat; 
     display: block; 
     width: 16px; 
     height: 16px; 
    } 
</style> 


<form id="myform"> 
    <label for="field">Required, URL: </label> 
    <input class="left" id="field" name="field" OnKeyUp="$("#myform").validate"/> 
    <br/> 
    <input type="submit" value="Validate!" /> 
</form>

來源

2011-12-22 John Smith

什麼都嘗試這麼遠？問題是什麼？ – Nettogrof 2011-12-22 23:46:50

你想知道用戶何時完成輸入？字體大小？模糊？加密將導致它在每一個單一的密鑰上進行驗證（除非你指定它是當用戶按下特定的密鑰時，如Enter） – Andre 2011-12-22 23:53:25

看看下面的代碼。我想這是你需要的。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
    <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js"></script> 
<script type="text/javascript"> 
jQuery.validator.setDefaults({ 
    debug: true, 
    success: "valid" 
});; 
</script> 

    <script> 
    $(document).ready(function(){ 
    $("#myform").validate({ 
    rules: { 
    field: { 
     required: true, 
     url: true 
    } 
    } 
}); 

$("#field").keyup(function(){ 
$('#myform').valid(); 
}); 
    }); 
    </script> 
    <style>#field { margin-left: .5em; float: left; } 
    #field, label { float: left; font-family: Arial, Helvetica, sans-serif; font-size: small; } 
    br { clear: both; } 
    input { border: 1px solid black; margin-bottom: .5em; } 
    input.error { border: 1px solid red; } 
    label.error { 
     background: url('http://dev.jquery.com/view/trunk/plugins/validate/demo/images/unchecked.gif') no-repeat; 
     padding-left: 16px; 
     margin-left: .3em; 
    } 
    label.valid { 
     background: url('http://dev.jquery.com/view/trunk/plugins/validate/demo/images/checked.gif') no-repeat; 
     display: block; 
     width: 16px; 
     height: 16px; 
    } 
</style> 


<form id="myform"> 
    <label for="field">Required, URL: </label> 
    <input class="left" id="field" name="field"/> 
    <br/> 
    <input type="submit" value="Validate!" /> 
</form>

來源

2011-12-22 23:54:34

你可以使用在本頁面

http://api.jquery.com/change/

描述當您更改輸入字段中的文本捕捉，然後點擊即可，之後應用您的驗證功能change()。

來源

2011-12-22 23:52:35 macgyver

你應該能夠在驗證評估與element方法的單個元素：

$(document).ready(function() { 
    var $validator = $("#myform").validate({ 
     rules: { 
      field: { 
       required: true, 
       url: true 
      } 
     } 
    }); 

    $("#field").keyup(function() { 
     $validator.element(this); 
    }); 
});

這將在每個keyup事件驗證#field。

下面是一個例子：http://jsfiddle.net/bp8wP/

來源

2011-12-23 00:00:55

jquery通過KeyUp運行函數而不是提交

回答

相關問題