最近访客
百度未收录

WordPress留言模板如何添加字数统计功能

WordPress留言模板如何添加字数统计功能-狐狸库
wordpress

可能有WordPress网站已发现我的评论模板有一个字数统计功能,本来只是试验一下,准备用到其它模板中,有人问咋弄的,好吧,那就按下面的方法把这个功能也加到自己的主题中。

一、把下面的javascript代码添加到主题的JS文件中

// 留言字数统计
function checktext(text)
{
  allValid = true;
  for (i = 0;  i < text.length;  i++)
  {
   if (text.charAt(i) != \" \")
   {
    allValid = false;
    break;
   }
  }
return allValid;
}
function xx(message,total,used,remain)
{
 var max;
 max = total.value;
 if (message.value.length > max) {
 message.value = message.value.substring(0,max);
 used.value = max;
 remain.value = 0;
 alert(\"留言不能超过 500 个字!\");
 }
 else {
 used.value = message.value.length;
 remain.value = max - used.value;
 }
}

二、打开评论模板comments.php找到类似:

<p><textarea name=\"comment\" id=\"comment\" tabindex=\"4\"></textarea></p>

替换为:

<span class=\"cs\">
    <span class=\"csc\">
        <input name=\"total\" size=\"2\" value=\"500\" class=\"inputtext\">
        <input name=\"remain\" size=\"2\" value=\"500\" class=\"inputtext\">
    </span>
    留言不能超过500字,已输入字数:<input name=\"used\" size=\"2\" value=\"0\" class=\"inputtext\">
</span>
    <p><textarea name=\"comment\" id=\"comment\" tabindex=\"4\" onKeyDown=\"xx(this.form.comment,this.form.total,this.form.used,this.form.remain);\" onKeyUp=\"xx(this.form.comment,this.form.total,this.form.used,this.form.remain);\"></textarea></p>

其中的数字“500”是限制的字符数,可根据需要适当修改。

三、添加样式

 /******** 字数统计 ********/
.cs {
    float: right;
    color: #757575;
    }
.csc {
    display:none;
    }
.inputtext {
    height:13px;
    color: #0196e3;
    border:none;
    background: transparent !important;
    }

添加上述代码后,当留言超过500字时,会弹出警告提示框,但并不具备阻止提交留言功能。

另外,想同时限制最少输入字数,可以把下面代码加到主题的functions.php模版中:

// 评论最少字数限制
function minComment($content){
    global $comment;
        $num = 10; //设置评论最少字数限制为 10
    $content = $comment->comment_content;
    if(str_word_count($content) < $num)
        wp_die(\'提示:不能少于10个字\');
}
add_action(\'pre_comment_on_post\', \'minComment\');

当输入文字少于设定值,会有错误提示

温馨提示: 本文最后更新于2022/10/20 04:27:32。若文章内容或图片失效,请 留言联系站长反馈!
!
也想出现在这里? 联系我们
创意广告
© 版权声明
THE END
点赞0赞赏 分享
评论 抢沙发

请登录后发表评论

    请登录后查看评论内容