在WordPress中使用jQuery

WP/jQuery的新手

我在WP中创建了一个简单的表单。不使用插件，只是手工编码

我现在尝试使用jQuery将数据从一个表单字段传递到另一个表单字段

我检查了jQuery库是否可用于页面，并使用wp_enqueue_脚本加载了一个自定义的.js文件

HTML（在WP页面中）：

我已经在一个HTML页面（在WP之外）测试了代码，它肯定能工作

我想知道是否有人能告诉我我做错了什么？为什么它不起作用

棘手的是，jQuery的这个特定副本在默认情况下处于兼容模式。这意味着jQuery的典型“$”快捷方式不起作用，因此它不会与任何其他也使用美元符号的JavaScript库（如MooTools或Prototype）冲突

摘自：

您可以按如下方式使用

jQuery

：

jQuery(document).ready(function ($) {
    $('#field_1').change(function () {
        $('#field_2').val($(this).val());
    });
});

编辑

WordPress附带的jQuery库设置为noConflict（）模式（请参阅wp includes/js/jQuery/jQuery.js）。这是为了防止与WordPress可以链接的其他JavaScript库的兼容性问题

在noConflict（）模式下，jQuery的全局$shortcut不可用

---

文档：

尝试检查您是否正确加载了jQuery文件。您可以通过在函数前后添加

console.log（message）

来检查函数是否正在启动，只是为了测试它。在Chrome上按Ctrl+Shift+I来检查控制台

例如：

$(document).ready(function () {

    console.log('jQuery initialized'); //check 1 - jQuery included

    $('#field_1').change(function () {
        $('#field_2').val($(this).val());
        console.log('function fired'); //check 2 - value changed
    });

});

您还可以尝试将jquerybycdn作为备选方案包含在HTML中

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js" type="text/javascript">

我的坏

---

终于找到了问题所在。我在输入id名称中有一个语法错误（因此出现了“UncaughtTypeError:cannotreadproperty”querySelector“of null”）

感谢所有提供帮助的人

---

非常感谢！

转到查看页面源代码，检查页面上是否包含jQuery文件Hi Deep Kakkar，我检查了页面源代码。在关闭标记之前，custom.js文件正在与其他js文件一起加载。最后找到了问题所在。我在输入id名称中遇到语法错误（因此出现了“Uncaught TypeError:无法读取null的属性”querySelector'）。非常感谢所有提供帮助的人。嗨，Tushar，感谢您的响应。尝试了此操作，但没有成功。它不起作用。两个错误：Uncaught TypeError:无法读取null的属性“querySelector”（在main.js中）Uncaught Error:语法错误，无法识别的表达式：（在jquery.js？ver=1.11.2:2中）

$(document).ready(function () {

    console.log('jQuery initialized'); //check 1 - jQuery included

    $('#field_1').change(function () {
        $('#field_2').val($(this).val());
        console.log('function fired'); //check 2 - value changed
    });

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.js" type="text/javascript">