如何解决 Ninja Forms 加载失败与样式优化问题

一、问题背景

在 WordPress 网站中，原本使用 WPForms 插件，前端出现JavaScript问题，

可以通过通过外部引入暂时解决问题。

最终由于 WPForms 免费版不支持表单数据存储，改用了 Ninja Forms。

但是，更换插件Ninja Forms后依然出现表单无法提交、前端报错等问题。

二、遇到的问题现象

表单页面通过F12控制台查看报错日志：“nfInlineVars is not defined”
控制台 JS 报错，表单部分功能无法正常使用。
表单虽然显示，但提交失败或存在异常。

三、问题排查思路

1. 检查 WordPress 插件依赖

Ninja Forms、WPForms、Contact Form 7 等主流表单插件，均依赖 jQuery 库。

怀疑是否因为主题或其它代码，导致 jQuery 未正常加载。

2. 检查主题代码

在主题 /wp-content/themes/wordpress-qzdy-themes-main/qzdy_fun.php 中发现以下代码：

function my_enqueue_scripts() {    wp_deregister_script('jquery');}add_action( 'wp_enqueue_scripts', 'my_enqueue_scripts', 1 );if ( !is_admin() ) {    function my_init_method() {        wp_deregister_script( 'jquery' );    }    add_action('init', 'my_init_method');}

➡️ 直接禁止了全站的 jQuery 加载。

✅ 结论：

➡️ Ninja Forms 报错的根本原因是：jQuery 被强制禁止加载，导致 Ninja Forms 前端 JS 无法运行。

四、解决方案

方案一：简单粗暴恢复 jQuery 加载

将上述禁止 jQuery 的代码全部注释或删除：

// function my_enqueue_scripts() {//     wp_deregister_script('jquery');// }// add_action( 'wp_enqueue_scripts', 'my_enqueue_scripts', 1 );// if ( !is_admin() ) {//     function my_init_method() {//         wp_deregister_script( 'jquery' );//     }//     add_action('init', 'my_init_method');// }

保存、清除缓存。

✅ 表单恢复正常，数据可提交，控制台不再报错。

方案二：按需加载 jQuery，性能最优

为了避免全站加载 jQuery，影响性能，可按需在表单所在页面加载。

例如，表单页面 ID 为 1744：

function custom_enqueue_jquery_for_ninja_forms() {    if ( is_page(array(1744)) ) {         wp_enqueue_script('jquery');    } else {        wp_deregister_script('jquery');    }}add_action('wp_enqueue_scripts', 'custom_enqueue_jquery_for_ninja_forms', 1);