在functions.php中执行document.ready

Question

I need to run a script after a hook is fired in my functions.php file. Im using a wordpress mailchimp plugin, I need to do some text inserts and display = "none", etc, in the html:

add_action( 'mc4wp_form_success', function() {
   // do something
     echo '<script type="text/javascript">',
        'console.log("starting....");', // this works
     'document.getElementById("mailchimp-is-subscribed").style.display = "none";',
         'document.getElementById("mailchimp-success-form").style.display = "block";',
         'console.log("end");',
     '</script>';
});

The error I got was style is null. I assume the document is not ready? $ does not work. Am I doing this wrong? I need to run that code after that hook is called. Putting the code in .js file works great. Thanks

Answer 1

You can add your code as an on DOMContentLoaded event:

document.addEventListener('DOMContentLoaded', function () { ..your_code... }, false);

Check this answer: pure JavaScript equivalent to jQuery's $.ready() how to call a function when the page/dom is ready for it