CODEWITHSUNDEEP
javascripthtmlwordpress
Suresh Kumar
Suresh Kumar

Reputation: 85

How to use inline JavaScript in WordPress

I am trying to create a popup in WordPress. My popup opened but cancel and send buttons are not working.

This is my script and code :

Script

<script type="text/javascript" charset="utf-8">
    $(function() {
        function launch() {
             $('#sign_up').lightbox_me({centered: true, onLoad: function() { $('#sign_up').find('input:first').focus()}});
        }

        $('#try-1').click(function(e) {
            $("#sign_up").lightbox_me({centered: true, preventScroll: true, onLoad: function() {
                $("#sign_up").find("input:first").focus();
            }});

            e.preventDefault();
        });

        $('table tr:nth-child(even)').addClass('stripe');
    });
</script>

and this is my form

<a href="#" id="try-1" class="sprited"><div class="call"></div></a>
<div id="sign_up">
    <h3 id="see_id">Request a call Back</h3>
    <div id="sign_up_form">
        <form id="form1" name="form1" action="../mail.php" method="post" >
            <label><strong>Name :</strong> <input class="sprited"/></label>
            <label><strong>Mobile No :</strong> <input class="sprited"/></label>
            <div id="actions">
                <input type="button" name="cancel" value="Cancel" class="close form_button sprited" />
                <input type="button" name="send" value="Send" class="form_button sprited" />
            </div>
        </form>
    </div>
    <a id="close_x" class="close sprited" href="#">close</a>
</div>

Upvotes: 1

Views: 1083

Answers (1)

Pieter Goosen
Pieter Goosen

Reputation: 9951

Don't use inline javascript. As suggested by rosscower, add your javascript in a js file. You now need to enqueue it properly. Don't just dump it in the header. You will also need to think about conditional statements here to load your jquery file, if you only need to load it on a certain page you need to load it conditionally, otherwise this will load on all pages.

Example, you called your js file myjs.jsand you add it in a folder called js and want to load it only on the homepage, you'll do something like this

function register_my_js() {
if(is_home()) {
 wp_enqueue_script( 'my-script',   get_template_directory_uri() . '/js/myjs.js',    array(), '', true );
 }
}

 add_action( 'wp_enqueue_scripts', 'register_my_js' );

Upvotes: 2

Related Questions