CODEWITHSUNDEEP
javascript
user2209211
user2209211

Reputation: 11

Need help moving an inline script to an external file

I'm new to JavaScript and I've got two issues I need help with.

First - I want to take an inline script and put it in its own .js file, but I'm not certain of the syntax I need to change - because it doesn't work after I place in it's own file. I'm changing an image onClick btw and I've got several of them. I'm just showing one in my example.

I've linked to my new external file, so that's not the issue.

Here's what I've got in the external file right now -

$(document).ready(function(){

    function changeImage() {

            if (document.getElementById("eventChecked").src == "file:///G:/design/folder/img/checkBox.gif") 
            {
                document.getElementById("eventChecked").src = "file:///G:/design/folder/img/checked.gif";
            }
            else 
            {
                document.getElementById("eventChecked").src = "file:///G:/design/folder/img/checkBox.gif";
            }
        }
});

I realize I've got a function call twice, but not really sure how to fix it.

Second Issue - the src path above only seems to work if I use an absolute url, but I'm working on this locally, and then I'll pass it onto a dev team that will work on it locally, and then it will go live. That's 3 diff absolute paths, and at least 3 sets of changes to the src path. How can I make it look for root or keep it simpler?

Thanks for any help you can give.

Upvotes: 0

Views: 1134

Answers (1)

RobG
RobG

Reputation: 147403

The simple fix is to call the function:

    $(document).ready(function(){

        function changeImage() {

                 ...

            }

        // Call the function!
        changeImage();  // <---- Call the function!!

    });

However, it seems that the changeImage function is a one-of, so you can probably just put it as the function body of the anonymous function called by ready.

Edit

To simply execute the code, don't make it a function declaration:

$(document).ready(function(){

    if (document.getElementById("eventChecked").src == "file:///G:/design/folder/img/checkBox.gif") 
    {
        document.getElementById("eventChecked").src = "file:///G:/design/folder/img/checked.gif";
    }
    else 
    {
        document.getElementById("eventChecked").src = "file:///G:/design/folder/img/checkBox.gif";
    }
});

Upvotes: 1

Related Questions