javascript驗證碼未驗證

Question

我有一個帶有驗證碼驗證的html表單，並且我正在使用Java腳本來創建驗證碼。 它將來自Java腳本的驗證碼值輸入到輸入feild中，但是在單擊按鈕並發布表單時不進行驗證。 下面我把鏈接放在小提琴

    <form action="/Admin/Public/FormMailer.aspx" method="post" id="FormSave1" enctype="multipart/form-data" name="FormSave1" style="margin-top:20px">
        <input type="hidden" name="FM_Charset" value="iso-8859-1" /> <input type="hidden" name="FM_html" value="true" />
        <input type="hidden" name="FM_Subject" value="E-mail from my website" /> <input type="hidden" name="FM_FromEmail" value="" /> 
        <input type="hidden" name="FM_FromName" value="Dynamicweb FORMAILER" />
        <input type="hidden" name="FM_Template" value="Mail.html" /> <input type="hidden" name="FM_ToEmail" value="" />
        <input type="hidden" name="FM_ToEmail" value="" />
<table>
        <tbody>
<tr>
<td>INDTAST TALLET HERUNDER</td>
<td><input type="text" id="txtCaptcha" style="background-image:url(1.jpg); text-align:center; border:none;font-weight:bold; font-size: 16px;" disabled="">
</td>
</tr>
 <tr>
 <td><td></td><td>
 <input type="text" id="txtInput" style="margin-left: 20px; text-align: center;" required>
 </td>
 </tr>
 <td>
 <input type="submit" id="submit" onclick="ValidCaptcha();">
 </td>
</tbody></table>
     </form>

Java腳本

    function DrawCaptcha()
  {
    var a = Math.ceil(Math.random() * 10)+ '';
    var b = Math.ceil(Math.random() * 10)+ '';
    var c = Math.ceil(Math.random() * 10)+ '';
    var d = Math.ceil(Math.random() * 10)+ '';
    var e = Math.ceil(Math.random() * 10)+ '';
    var f = Math.ceil(Math.random() * 10)+ '';
    var g = Math.ceil(Math.random() * 10)+ '';
    var code = a + '' + b + '' + '' + c + '' + d + '' + e + ''+ f + '' + g;
    document.getElementById("txtCaptcha").value = code
      }

      // Validate the Entered input aganist the generated security code function
    function ValidCaptcha(){
      var str1 = removeSpaces(document.getElementById('txtCaptcha').value);
    var str2 = removeSpaces(document.getElementById('txtInput').value);

    if (str1 == str2) {
      //TRUE
      $("form").submit();
    } else {
      //FALSE
      alert("TALLET ER FORKERT!");
    }

  }

  // Remove the spaces from the entered and generated code
  function removeSpaces(string)
  {
    return string.split(' ').join('');
  }

  $(document).ready(function() {
    DrawCaptcha();
    javascript:enableField()
      });

鏈接到小提琴

Answer 1

• 首先：驗證碼應該在服務器端進行驗證，而不是在javascript中。 在您的情況下，每個人都可以手動提交表單，而無需在驗證碼字段中輸入任何內容。
• 第二件事：驗證碼不應采用文本形式（！）。 每個想要破壞它的人都將自動復制文本。

因此，您的驗證碼完全沒用。 它對實際用戶來說很煩人，並且不能完全針對自動請求進行保護。

---

至於你的問題：

->更改您的驗證功能：

if (str1 == str2) {
  //TRUE
  return 1;
} else {
  //FALSE
  alert("TALLET ER FORKERT!");
  return 0;
}

->並將此代碼添加到文檔准備功能中：

document.getElementById('FormSave1').onsubmit = function() {
    if(!ValidCaptcha())
       return false;
}

->刪除內聯onclick事件以提交按鈕。

小提琴

請注意，onsubmit事件在內聯腳本中不起作用，必須以這種方式分配