如何在WordPress中实现自定义AJAX评论功能?

玖比肆 WordPress 42

解释如何使用WordPress代码实现自定义AJAX评论功能的技巧和最佳实践。

回复

共1条回复 我来回复
  • 玖比肆的头像
    玖比肆 评论

    实现自定义AJAX评论功能的步骤如下:

    1. 注册AJAX处理程序:在主题的functions.php文件中,注册一个AJAX处理程序以处理评论提交。可以使用wp_ajax_和wp_ajax_nopriv_前缀注册已验证和未验证的请求。以下是注册AJAX处理程序的示例代码:

    ```
    add_action('wp_ajax_custom_comment', 'custom_comment_handler');
    add_action('wp_ajax_nopriv_custom_comment', 'custom_comment_handler');
    function custom_comment_handler() {
    // 处理评论提交
    }
    ```

    2. 编写AJAX处理程序:编写处理评论提交的AJAX处理程序。使用WordPress内置的评论函数处理评论和错误。将评论HTML代码替换为JSON响应。以下是一个处理评论提交的简单JavaScript函数:

    ```
    function submitComment() {
    var name = jQuery('#comment-author').val();
    var email = jQuery('#comment-email').val();
    var comment = jQuery('#comment-text').val();
    jQuery.ajax({
    url: myAjax.ajaxurl,
    type: 'POST',
    data: {
    action: 'custom_comment',
    name: name,
    email: email,
    comment: comment,
    security: myAjax.nonce
    },
    success: function( response ) {
    var comment = jQuery.parseJSON( response );
    if ( comment.status == 'success' ) {
    // 在评论列表中显示新评论
    } else {
    // 在错误消息中显示评论错误
    }
    }
    });
    }
    ```

    3. 在主题中添加AJAX评论表单:在主题中添加一个包含评论输入字段的表单,以便用户提交评论。使用submitComment()函数处理表单提交。

    4. 实现AJAX评论的实时更新:通过使用jQuery定时器定期轮询评论列表,以便在新评论提交时显示它们。以下是实现AJAX评论实时更新的示例代码:

    ```
    function getNewComments( lastCommentTime ) {
    jQuery.ajax({
    url: myAjax.ajaxurl,
    type: 'POST',
    data: {
    action: 'get_new_comments',
    last_comment_time: lastCommentTime,
    security: myAjax.nonce
    },
    success: function( response ) {
    var comments = jQuery.parseJSON( response );
    for ( var i = 0; i < comments.length; i++ ) { // 在评论列表中显示新评论 } // 设置定时器以获取新评论 setTimeout( function() { getNewComments( comments[ comments.length - 1 ].time ); }, 10000 ); } });}getNewComments( 0 );```可以在主题的functions.php文件中使用wp_ajax_get_new_comments和wp_ajax_nopriv_get_new_comments前缀注册用于获取新评论的AJAX处理程序。在该处理程序中,查询具有大于最后评论时间的评论并将其作为JSON响应返回。在成功响应中,将新评论添加到评论列表中。使用WordPress实现自定义AJAX评论功能的最佳实践:1. 始终验证AJAX请求:使用nonce字段验证AJAX请求以确保请求来自实际用户,并防止CSRF攻击。2. 处理AJAX响应:使用JSON响应代替HTML响应,并在客户端处理响应以更新相应部分。3. 在AJAX评论表单中包括适当的输入验证:验证评论输入以确保提交的评论格式正确,并显示错误消息以指示有错误的字段。4. 轮询方式应该是高效的:使用setTimeout函数设置定时器,以防轮询方式使用CPU资源过高。

    2023年 5月 11日 上午6:54 0条评论
微信客服
分享本页
返回顶部
玖比肆(9Bi4)专注于帮助企业实现数字化转型,提供全方位的网站建设、网络运营、网络推广、网络营销和SEO优化等一系列数字化营销服务。