Jquery驗證引擎在Chrome和Safari中不工作

我從https://github.com/posabsolute/jQuery-Validation-Engine下載了Jquery驗證引擎，它在IE和Firefox中運行良好，但它不適用於Chrome和Safari，問題在於如果字段是空的或無效的字符被輸入，表單將始終被提交，因爲我使用php輸入數據到數據庫obvioulsy字段輸入爲空。Jquery驗證引擎在Chrome和Safari中不工作

我相信我包含了所有需要的腳本;您是否使用插件閱讀過有關Chrome和Safari問題的其他任何成員？我會很感激你的幫助好朋友。

添加在編輯的代碼（對不起朋友）：

<!doctype html> 
    <html> 
<head> 
<meta charset="utf-8"> 
<title>Untitled Document</title> 
<link rel="stylesheet" href="css/validationEngine.jquery.css" type="text/css"/> 
<link rel="stylesheet" href="css/template.css" type="text/css"/> 
<link rel="stylesheet" href="css/styles.css" type="text/css"/> 
<script src="js/jquery-1.8.2.min.js" type="text/javascript"> 
</script> 
<script src="js/languages/jquery.validationEngine-en.js" type="text/javascript" charset="utf-8"> 
</script> 
<script src="js/jquery.validationEngine.js" type="text/javascript" charset="utf-8"> 
</script> 
<script> 
    jQuery(document).ready(function(){ 
     // binds form submission and fields to the validation engine 
     jQuery("#collect").validationEngine('attach'); 
    }); 
</script> 
</head> 

<body onLoad="formReset()" onUnload="formReset()"> 
<script> 
function formReset() 
{ 
document.getElementById("collect").reset(); 
} 
</script> 
<div class="formholder"> 
    <form id="collect" class="formular" method="post" action="insert.php"> 
<fieldset> 
     <label> 
    <input value="" data-prompt-position="topRight:0,20" class="validate[required,custom[onlyLetterSp]] text-input" type="text" name="nombre" /> 
    </label> 
     <br/> 
     <label> 
    <input value="" class="validate[required,custom[email]] text-input" data-prompt-position="topRight:0,20" type="text" name="email" /> 
    </label> 
     <br/> 
     <label> 
    <input value="" data-prompt-position="topRight:0,20" class="validate[required,custom[phone]] text-input" type="text" name="telefono" /> 
    </label> 
     <br/> 
     <label> 
    <select style="height:35px; width:200px;" name="informacion" class="select" form="contact-form" type= "select"> 
      <option value="option1">option1</option> 
      <option value="option2">option2</option> 
      <option value="option3">option3</option> 
      <option value="option4">option4</option> 
      <option value="option5">option5</option> 
     </select> 
    </label> 
     <input class="submit" type="submit" value= ""/> 
    </fieldset> 
    <hr/> 
</form> 
    </div> 
    </body> 
    </html>

來源

2013-05-14 i' llbdevsomeday

您應該對PHP驗證方面也是如此，只是可以肯定的。顯示你的代碼，我們不是千里眼。 – Adder 2013-05-14 07:15:56

嗨，Adder，是的，我知道，只是我真的很喜歡這個插件顯示錯誤的工具提示，我仍然kindda新手與PHP的東西以及。我按照要求添加了代碼，對於那個朋友很抱歉。 – 2013-05-14 07:29:03

看到這個代碼

它現在的工作...

<!doctype html> 
    <html> 
<head> 
<meta charset="utf-8"> 
<title>Untitled Document</title> 
    <link rel="stylesheet" href="css/validationEngine.jquery.css" type="text/css" /> 
    <script src="js/jquery-1.8.2.min.js" type="text/javascript"></script> 
    <script src="js/jquery.validationEngine-en.js" type="text/javascript" charset="utf-8"></script> 
    <script src="js/jquery.validationEngine.js" type="text/javascript" charset="utf-8"></script> 
<script> 
     jQuery(document).ready(function(){ 
      // binds form submission and fields to the validation engine 
      jQuery("#collect").validationEngine('attach'); 
    }); 
</script> 
</head> 

<body onLoad="formReset()" onUnload="formReset()"> 
<script> 
function formReset() 
{ 
document.getElementById("collect").reset(); 
} 
</script> 
<div class="formholder"> 
    <form id="collect" class="formular" method="post" action="insert.php"> 
<fieldset> 
     <label> 
    <input value="" data-prompt-position="topRight:0,20" class="validate[required] text-input" type="text" name="nombre" /> 
    </label> 
     <br/> 
     <label> 
    <input value="" class="validate[required] text-input" data-prompt-position="topRight:0,20" type="text" name="email" /> 
    </label> 
     <br/> 
     <label> 
    <input value="" data-prompt-position="topRight:0,20" class="validate[required] text-input" type="text" name="telefono" /> 
    </label> 
     <br/> 
     <label> 
    <select style="height:35px; width:200px;" name="informacion" class="select" form="contact-form" type= "select"> 
      <option value="option1">option1</option> 
      <option value="option2">option2</option> 
      <option value="option3">option3</option> 
      <option value="option4">option4</option> 
      <option value="option5">option5</option> 
     </select> 
    </label> 
     <input class="submit" type="submit" value= "test"/> 
    </fieldset> 
    <hr/> 
</form> 
    </div> 
    </body> 
    </html>

來源

2013-05-14 09:10:48 Haseeb

改變了什麼？檢查答案是否正確，這會提高您的接受率。 – Adder 2013-05-14 10:31:01

非常感謝@haseeb，它似乎與其他樣式表引起的問題，將檢查，並會讓你們知道，非常感謝你也是Adder。 – 2013-05-14 16:40:30

我發現問題夥伴，它與我的CSS代碼中的顯示屬性有關：'.formular input，.formular select，.formular textarea { \t display：block; \t margin-bottom：5px; \t height：25px; \t box-shadow：0px 2px 7px rgba（0，0，0，0.80）; \t -moz-box-shadow：0px 2px 7px rgba（0，0，0，0.80）; \t -webkit-box-shadow：0px 2px 7px rgba（0，0，0，0.80）; \t border-radius：6px; \t -webkit-border-radius：6px; \t -moz-border-radius：6px; }'。將嘗試找到替代顯示：塊在我的CSS。謝謝！ – 2013-05-14 17:58:48

Jquery驗證引擎在Chrome和Safari中不工作

回答

相關問題