在表單提交上調用javascript函數（使用jQuery表單驗證）

Question

我有一個使用jQuery驗證插件設置的表單。

在這裏看到：http://jsfiddle.net/9q865xof/

而且我從形式如何添加插件之前驗證了這種（非jQuery的）JavaScript函數。

function busregform(form, password) { 

// new input for hashed password 
var p = document.createElement("input"); 

// create element 
form.appendChild(p); 
p.name = "p"; 
p.type = "hidden"; 
p.value = hex_sha512(password.value); 

// clear plaintext password 
password.value = ""; 

// submit the form 
form.submit(); 
return true; 

} 

在其自己的文件中也有hex_sha512（）函數。

這裏的想法是通過busregform（）從表單發佈密碼來創建一個散列密碼，然後發佈我的PHP腳本進行處理。

我曾嘗試加入這個我驗證jQuery代碼：

submitHandler: function(){ 
    var pw = $("#pass").val(); 
    var form = $("#business-reg-form"); 
    busregform(form,pw); 
} 

，沒有運氣...不知道現在該做什麼。我在想我應該使用Ajax？

當插件驗證表單被提交時，如何調用busregform（）？

Answer 1

的busregform方法希望對form一個DOM元素的引用，所以你需要

$('#business-reg-form').validate({ 
 
    rules: { 
 
    address: { 
 
     required: true, 
 
     minlength: 6 
 
    }, 
 
    email: { 
 
     required: true, 
 
     email: true, 
 
     minlength: 6 
 
    }, 
 
    company: { 
 
     required: true 
 
    }, 
 
    pass: { 
 
     required: true, 
 
     minlength: 6 
 
    }, 
 
    confirmpw: { 
 
     required: true, 
 
     minlength: 6, 
 
     equalTo: "#pass" 
 
    } 
 
    }, 
 
    submitHandler: function() { 
 
    var pw = $("#pass"); 
 
    var form = $("#business-reg-form"); 
 
    //pass the dom element reference 
 
    busregform(form[0], pw[0]); 
 
    return false; 
 
    } 
 
}); 
 

 
function busregform(form, password) { 
 

 
    // Create a new element input, this will be our hashed password field. 
 
    var p = document.createElement("input"); 
 

 
    // Add the new element to our form. 
 
    form.appendChild(p); 
 
    p.name = "p"; 
 
    p.type = "hidden"; 
 
    p.value = hex_sha512(password.value); 
 

 
    // Make sure the plaintext password doesn't get sent. 
 
    password.value = ""; 
 

 
    // Finally submit the form. 
 
    form.submit(); 
 
    return true; 
 

 
} 
 

 
if (!window.hex_sha512) { 
 
    //stub method 
 
    window.hex_sha512 = function(value) { 
 
    return 'hex_sha512-' + value; 
 
    } 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js"></script> 
 
<form method="post" name="business_regform" id="business-reg-form" action=""> 
 
    <p> 
 
    <input type="text" name="company" id="company" placeholder="company name" required /> 
 
    </p> 
 
    <p> 
 
    <input type="text" name="address" id="address" placeholder="address" required /> 
 
    </p> 
 
    <p> 
 
    <input type="text" name="email" id="email" placeholder="email" required /> 
 
    </p> 
 
    <p> 
 
    <input type="text" name="pass" id="pass" placeholder="password" required /> 
 
    </p> 
 
    <p> 
 
    <input type="text" name="confirmpw" id="confirmpw" placeholder="confirm password" required /> 
 
    </p> 
 
    <p> 
 
    <input type="submit" class="btn" id="business-reg-submit" value="submit" /> 
 
    </p> 
 
</form>

演示： Fiddle - 您可以使用網絡標籤查看哈希密碼