如何让我的JavaScript在网站上工作？（当前代码只在Fiddle上工作，而不是在网站上）

我想为产品页面上的自定义字段创建一个字符计数器。我尝试使用以下JavaScript和HTML代码来实现此功能：

HTML:

JavaScript:

在Fiddle程序中运行此命令时，我可以生成字符计数器。然而，当我将上述代码放入网站时，字符计数器似乎不起作用。我已经检查了源代码，所有的编码都在那里

我可以看到其他人也经历过与我类似的问题，如第个问题：。作为JavaScript的新手，我不能100%确定是否有合适的修复方法

---

是否有人能为我指出正确的方向，说明我需要进行哪些相关更改才能使我的上述编码正常工作？

您正在使用jQuery功能，但是否导入jQuery以便在您的站点中使用它？此外，您的函数应该包装在jQuery docready函数中

$( document ).ready(function() {
    //your code
});

---

它在小提琴中工作，因为JSFIDLE为您提供了jQuery。在您的构建中，您必须导入它。

您可以按如下方式更改绑定：

jQuery(document).on('keyup', '.product-custom-text', updateCount);
jQuery(document).on('keydown', '.product-custom-text', updateCount);

此绑定不需要位于$document.readyfunction{function内，因为它适用于可用的DOM元素

您需要使用document.ready for keyup事件。在此之前，您在jQuery选择器中引用的DOM元素不可用

jQuerydocument.on'keyup'，'product custom text'，updateCount； jQuerydocument.on'keydown'，'product custom text'，updateCount； 函数updateCount{ var cs=$this.val.length； jQuery'character_count'.textcs； } 自定义文本

---

正如您所指出的，它是wordpress：不需要包含jquery源代码。默认情况下，WP会将其排队，尽管其他插件可以删除它

将jquery代码包装在$.ready中

---

对于wordpress：它不强制任何冲突模式，因此对于所有jquery代码，您必须使用jquery而不是$alias，或者使用以下作为$.ready包装器：jQueryfunction${//your code with$stuff}

你能给你的提琴贴一个链接吗？你要把jQuery导入到你的页面吗？同时试着把你的前两行包装在$document中。readyfunction{}把你的JavaScript包装在$document中。readyfunction{}您也在使用jquery。JSFIddle天生就有它。但是，当您将脚本包含在html中时，您还必须将jquery添加到脚本标记中，并将代码包装在$document.readyfunction{}谢谢你的建议。我已经尝试过了，但没有成功。关于，我是通过functions.php文件将其排队，还是直接将其硬编码到页面的模板页面中，这有关系吗？@Craig你必须在页面上包括，在页面上使用jquery代码使其工作。不要通过functions.php将其排队，只需复制并通过很遗憾，我复制了您在此处放置的建议代码，但没有成功。好的，请检查您的浏览器控制台并将javascript错误放在此处。

$( document ).ready(function() {
    //your code
});

jQuery(document).on('keyup', '.product-custom-text', updateCount);
jQuery(document).on('keydown', '.product-custom-text', updateCount);