admin管理员组

文章数量:1406937

Here is the code that works on my browser which I am trying to apply to my WordPress page:

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!-- Get jQuery -->    
<script 
src=".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>

When I break this code apart into js and html for wordpress (I put js into the Raw JS option in the visual poser, and html into Raw HTML), none of it works.

Can someone tell me why? Thanks

Here is the code that works on my browser which I am trying to apply to my WordPress page:

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!-- Get jQuery -->    
<script 
src="http://ajax.googleapis./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>

When I break this code apart into js and html for wordpress (I put js into the Raw JS option in the visual poser, and html into Raw HTML), none of it works.

Can someone tell me why? Thanks

  • javascript
  • jquery
  • html
  • wordpress
Share Improve this question asked Jun 8, 2016 at 15:25 ArielleArielle 111 silver badge4 bronze badges 2
  • Check your console log for any errors. Is the typed library being loaded? – Jonathan Eustace Commented Jun 8, 2016 at 16:23
  • How do I check in Wordpress for console log errors? Also see below for how I split up the code and put it into Raw JS and Raw HTML seperarely, I might have done something wrong there – Arielle Commented Jun 8, 2016 at 16:25
Add a ment  | 

2 Answers 2

Reset to default 3

This is because Wordpress uses jQuery in no conflict mode. Replace all the $ in your js code with jQuery. For example : 

 $(".reset").click(function(){
        $("#typed").typed('reset');
  });

should be 

jQuery(".reset").click(function(){
    jQuery("#typed").typed('reset');
});

You should put your script after the element that your refer at the script. HTML elements must be done loading before script does.

本文标签： javascriptUsing Visual Composer in Wordpress raw js not being applied to my raw htmlStack Overflow

版权声明：本文标题：javascript - Using Visual Composer in Wordpress; raw js not being applied to my raw html - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1744972528a2635318.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。