jquery.validate-按鈕禁用直到有效電子郵件

Question

我正在使用https://jqueryvalidation.org/來驗證前端的表單。 基本的“如果字段為空-驗證”工作正常。

但是，我希望最初禁用“提交”按鈕，直到輸入了有效的電子郵件地址為止。 我希望按鈕在字段有效時（在按鍵時）立即啟用。

因此，基本上，我只需要刪除有效的'btn-disabled'類。

我正在努力使用jQuery添加此功能/方法。 如果有人可以幫忙，將不勝感激。

這是一個稍微簡化的版本： http ://codepen.io/dagford/pen/kXJpEZ

$(document).ready(function(){

    $("#reset-form").validate({
        rules: {
            emailaddress: {
                required: true,
                email: true
            }

        },
        messages: {
            email: "Please enter a valid email address"
        }

    }); 

});

Answer 1

你有這個attr

$('#button1, #button2').attr("disabled", true);

Answer 2

輸入電子郵件地址后，您可以檢查表格是否有效。 默認情況下，使按鈕保持禁用狀態，並在驗證表單后刪除禁用的屬性。

 $("#emailaddress").on("blur", function(){
    if($("#reset-form").valid())
   {
       $("#btn-reset").removeAttr("disabled");
   }
 }); 

代碼筆： http : //codepen.io/anon/pen/YWLjKX? editors= 1010

Answer 3

檢查一下：

<script type="text/javascript">
                 (function() {
                        $('form > input').keyup(function() {
                            var empty = false;
                            $('form > input').each(function() {
                                if ($(this).val() == '') {    // write your code for valid email here
                                    empty = true;
                                }
                            });
                            if (empty) {
                                $('#register').attr('disabled', 'disabled');
                            } else {
                                $('#register').removeAttr('disabled');
                            }
                        });
                    })()
                </script>