以下是在我的浏览器上运行的代码,我正尝试将其应用到我的 WordPress 页面:
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!-- Get jQuery -->
<script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
</script>
<script src="js/typed.js"></script>
<script>
$(function(){
$("#typed").typed({
// strings: ["We are creative.", "We are hard-working.", "We
are collaborative.", "Try it out!"],
stringsElement: $('#typed-strings'),
typeSpeed: 50,
backDelay: 600,
loop: true,
contentType: 'text', // or text
// defaults to false for infinite loop
loopCount: false,
callback: function(){ foo(); },
resetCallback: function() { newTyped(); }
});
$(".reset").click(function(){
$("#typed").typed('reset');
});
});
function newTyped(){ /* A new typed object */ }
function foo(){ console.log("Callback"); }
</script>
</head>
<body>
<div id="typed-strings">
<p>We are creative.</p>
<p>We are collaborative.</p>
<p>We are connected.</p>
<p>We are Clarke.</p>
</div>
<span id="typed">We are</span>
<style type="text/css">
body {
font-size: 80px;
color: blue;
}
</style>
</body>
</html>
当我将这段代码分解为 WordPress 的 js 和 html 时(我将 js 放入可视化编辑器中的 Raw JS 选项,将 html 放入 Raw HTML),它们都不起作用。
有人能告诉我为什么吗?谢谢
最佳答案
这是因为 WordPress 在无冲突模式下使用 jQuery。将 js 代码中的所有 $
替换为 jQuery
。例如:
$(".reset").click(function(){
$("#typed").typed('reset');
});
应该是
jQuery(".reset").click(function(){
jQuery("#typed").typed('reset');
});
关于javascript - 在 Wordpress 中使用 Visual Composer;原始 js 未应用于我的原始 html,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37706758/