如何给DedeCMS的自定义表单加验证码功能?

给“自定义表单”加个验证码功能可以有效防止表单被反复提交,本文介绍如何为自定义表单添加验证码

 第一步:在后台频道模型—自定义表单里生成表单(参考这篇文章:http://www.exp99.com/jswz/dede/20140826_36.html

第二步:加入验证码

  1. <form action="../plus/diy.php" enctype="multipart/form-data" method="post" id="form"> 
  2.     <input type="hidden" name="action" value="post" /> 
  3.     <input type="hidden" name="diyid" value="1" /> 
  4.     <input type="hidden" name="do" value="2" /> 
  5.     <div class="form-item"> 
  6.     <label for="title">问题标题:</label><input type='text' name='title' id='title' style='width:250px'  class='intxt' value='' /> 
  7.     </div> 
  8.     <div class="form-item"><label for="description">问题描述:</label><input type="hidden" id="description" name="description" value="" style="display:none" /><input type="hidden" id="description___Config" value="FullPage=FALSE" style="display:none" /><iframe id="description___Frame" src="/include/FCKeditor/editor/fckeditor.html?InstanceName=description&amp;Toolbar=Diy" width="100%" height="350" frameborder="0" scrolling="no"></iframe></div><div class="form-item"><label for="qq">  QQ:</label><input type='text' name='qq' id='qq' style='width:250px'  class='intxt' value='' /> 
  9.     </div> 
  10.     <div class="form-item"><label for="email"> 邮箱:</label><input type='text' name='email' id='email' style='width:250px'  class='intxt' value='' /> 
  11.     </div> 
  12.     <div class="form-item"><label for="vdcode">验证码:</label> 
  13.     <input name="validate" type="text" class="intxt" id="vdcode" style="text-transform:uppercase;" size="8"/> 
  14. "vdimgck" align="absmiddle" onClick="this.src=this.src+'?'" style="cursor: pointer;" alt="看不清?点击更换" src="../include/vdimgck.php"/> <a href="javascript:vide(-1);" onClick="changeAuthCode();" id="js-vdcode">看不清?</a>  
  15.     </div> 
  16.     <input type="hidden" name="dede_fields" value="title,text;description,htmltext;qq,text;email,text" /> 
  17.     <input type="hidden" name="dede_fieldshash" value="8093f8438f06169690c39b7bb6195ae8" /> 
  18.     <div align='center' style='height:30px;padding-top:10px;'> 
  19.     <input type="submit" name="submit" value="提 交" class='coolbg' /> 
  20.     &nbsp; 
  21.     <input type="reset" name="reset" value="重 置" class='coolbg reset' /> 
  22.     </div> 
  23. </form> 

第三步:在第二步的页面上加入js

  1. //验证码 
  2. changeAuthCode(); 
  3. function changeAuthCode(){ 
  4.     var num = new Date().getTime(); 
  5.     var rand = Math.round(Math.random() * 10000); 
  6.     num = num + rand; 
  7.     $('#ver_code').css('visibility','visible'); 
  8.     if ($("#vdimgck")[0]){ 
  9.      $("#vdimgck")[0].src = "../include/vdimgck.php?tag="+num; 
  10.     } 
  11.     return false

第四步:修改表单处理页面,打开网站根目录/plus/diy.php文件, 在大概第58行左右位置加入一个if判断

  1. //验证码 
  2. if(!emptyempty($dede_fields)){ 
  3.     $validate = emptyempty($validate) ? '' : strtolower(trim($validate)); 
  4.     $svali = strtolower(GetCkVdValue()); 
  5.     if(($validate=='' || $validate != $svali) && preg_match("/6/",$safe_gdopen)){ 
  6.         ResetVdValue(); 
  7.         ShowMsg('验证码不正确!','-1'); 
  8.         exit(); 
  9.     } 

最终效果:参考本站的“在线提交问题

 

相关经验

导读书签
书签初始化中…