javascript验证码不验证

Question

我有一个带有验证码验证的 html 表单，我正在使用 java 脚本来创建验证码。它将来自 java 脚本的验证码值输入到输入字段中，但它不会在按钮单击时验证并发布表单。下面我把链接放到小提琴

    <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()
      });

link to fiddle

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 事件。

Fiddle

请注意，onsubmit 事件不适用于内联脚本，必须以这种方式分配