首页 » 开源/框架 » WordPress » 正文

给WordPress的comment_form()及其提交按钮添加class属性

我们知道,通过WordPress的 comment_form() 方法可以直接输出整个评论表单,而且这个函数也提供了很多参数让我们来修改表单的样式及显示的内容,为我们制作主题提供了很大的方便。

但是在使用这个函数的时候,大家可能注意到了,它提供了id_formid_submit两个参数让我们修改表单(form)及提交按钮(input type='submit')的id属性,却没有提供修改表单及提交按钮class属性的参数。而有时候我们却需要给这两个标签增加特定的class属性。下面就给大家分享两种给这两个标签增加class属性的方法。

方法一:PHP正则替换

首先找到原来comment_form($args);定义的位置,并把它替换成下面的代码:

ob_start();
comment_form($args);
//form表单添加样式
echo str_replace('class="comment-form"','class="comment-form your-form-class"',ob_get_clean()); 
//提交按钮添加样式
echo str_replace('id="submit"','id="submit" class="your-btn-class"',ob_get_clean());

大家可以通过修改上面代码中的your-form-classyour-btn-class来为表单及提交按钮添加一个或多个class属性。

方法二:jQuery方法

在主题的js文件中添加下面的代码

$(function(){
    //表单样式
    $("#commentform")).addClass('your-form-class');
    //按钮样式
    $("#commentform #submit").addClass('your-btn-class');
})

PS:这种方法虽然也可以为表单及提交按钮添加class属性,但是却需要在页面加载完JS之后才可以添加上,如果用户打开页面速度较慢的话,可能刚开始的时候会看到没有添加class样式之前的表单,而方法一在内容输出到页面的时候已经添加完,因此,更推荐大家使用第一种方法。

本文共 9 个回复

  • IT疯狂女 2015/02/16 15:12

    class这个之前在学校学过,但是现在都忘了、

  • 小二苘 2015/03/04 15:17

    这是个好方法

  • 文陆网志 2015/03/06 16:23

    不能在css中直接加class类吗?还有js放在头部会不会好一些呢

  • 懿古今 2015/03/17 22:00

    这个方面的东西还真的第一次涉及,从未想到能这样做,厉害

  • 夏日博客 2015/03/18 08:22

    还是比较喜欢正则的方法。

  • 久闻网赵昕熠 2015/03/19 14:45

    最近也在学习class这个,不过你能这样子做确实不一样,学习了!

  • hanbing17 2015/03/31 16:07

    最近也在学习class这个 :?:

发表评论