1

我有一个带有验证码验证的 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>

脚本

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

小提琴的链接

4

1 回答 1

2
  • 首先:验证码应该在服务器端进行验证,而不是在 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 事件不适用于内联脚本,必须以这种方式分配

于 2013-09-19T13:24:37.680 回答