2013-10-17 65 views
0

我有一个评论表单,它使用ajax显示评论框使用弹出菜单,并提交评论时,注释被注册到适当的职位(没有任何页面刷新)。我想添加验证码到这个表单。captcha验证在php中使用javascript

我试着实现下面的JavaScript代码,它生成一个小的随机数captcha。

<p> 

     <label for="code">Write code below > <span id="txtCaptchaDiv" style="color:#F00"></span><!-- this is where the script will place the generated code --> 

     <input type="hidden" id="txtCaptcha" /></label><!-- this is where the script will place a copy of the code for validation: this is a hidden field --> 

     <input type="text" name="txtInput" id="txtInput" size="30" /> 

</p> 

上面的html用于显示生成的验证码和用户输入代码的文本输入。

以下是JavaScript代码生成的代码 -

<script type="text/javascript"> 
//Generates the captcha function  
    var a = Math.ceil(Math.random() * 9)+ ''; 
    var b = Math.ceil(Math.random() * 9)+ '';  
    var c = Math.ceil(Math.random() * 9)+ ''; 
    var d = Math.ceil(Math.random() * 9)+ ''; 
    var e = Math.ceil(Math.random() * 9)+ ''; 

    var code = a + b + c + d + e; 
    document.getElementById("txtCaptcha").value = code; 
    document.getElementById("txtCaptchaDiv").innerHTML = code; 
</script> 

下JavaScript代码被用于验证码的验证 -

<script type="text/javascript"> 
function checkform(theform){ 
    var why = ""; 

    if(theform.txtInput.value == ""){ 
     why += "- Security code should not be empty.\n"; 
    } 
    if(theform.txtInput.value != ""){ 
     if(ValidCaptcha(theform.txtInput.value) == false){ 
      why += "- Security code did not match.\n"; 
     } 
    } 
    if(why != ""){ 
     alert(why); 
     return false; 
    } 
} 

// 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){ 
     return true;  
    }else{ 
     return false; 
    } 
} 

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

</script> 

此代码的工作正常时不与所述组合评论表格。结合评论表单,验证没有完成。

对于基于ajax的评论表单,提交按钮传递一个隐藏的输入变量来提交与相应的帖子相关的评论。 这是提交按钮代码为我的评论部分 -

<button type="submit" class="comment-submit btn submit" id="submitted" name="submitted" value="submitted"><?php _e('Submit', APP_TD); ?></button> 

<input type='hidden' name='comment_post_ID' value='<?php echo $post->ID; ?>' id='comment_post_ID' /> 

所以基本上我想我的代码首先检查验证码值上提交评论表单的按钮,如果它的正确我想用提交评论仅限ajax功能。

+0

您目前的创建和验证CAPTCHA的策略是一个坏主意, [这里](http://stackoverflow.com/questions/8987511/simple-javascript-captcha-using-random-array) - 为您的CAPTCHA有用于固定网页的任何一点,你将不得不生成它的服务器上并不与客户分享解决方案。您可以通过将txtCaptcha中的值复制到txtInput中来轻松破解。 –

+0

哦,这就是实际上,所以我想我已经建立了一个更安全的验证码使用PHP本身。在PHP –

+0

化妆验证码分配给会话,这样你们可以检查输入和实际验证码的文字... 如果妳希望它只是阿贾克斯的地方生成的验证码在Ajax调用链接.. – Froxz

回答

0

使用Javascript仅用于验证码不是一个好主意。因为你的安全只在客户端完成。

您的解决方案是使用停止表单提交的方法,并且只有当您的验证码函数返回true时,然后提交表单数据。这可能以不同的方式完成,例如jQuery:

$('.comment-submit').click(function(e){ 
    e.preventDefault(); 
    if (ValidCaptcha()) { 
    yourFormElement.submit(); 
    } 
});