Link to home
Start Free TrialLog in
Avatar of vb9666
vb9666Flag for United States of America

asked on

onclick in DIV tag not working in Mozilla and older verisons of IE

I have some code where there is a onclick event in a DIV tag. It works in new version of IE but not in IE 7 & 8 and Mozilla. Anyone know why this isn't working?

Code:
            <div class="program" style="cursor:pointer;" onclick="window.location('GBR.aspx');">
                <div class="programImage"><img src="images/Programs1.gif" style="border:0" alt="AltImage" /></div>
                <div class="programInfo">
                    <div class="programTitle">Heading Text Here</div>
                    <div class="programLine"></div>
                    <div class="programDesc">Text here</div>
                </div>
            </div>
Avatar of APoPhySpt
APoPhySpt
Flag of Portugal image

hi,

A better option, especially since you are using jQuery, is to not use inline event handlers.

Instead, use this HTML:

<div class="program" style="cursor:pointer;" >

<script>
$(document).ready(function () {
    $(".program").on("click", function () {
        window.location('GBR.aspx');
    });
});

</script>

Open in new window

in the example I posted before the javascript must come after the div, but if you want to centralize the javascript on the top of the page os something like that you can put the '<script>' tags at the top with the following modification:

<script>

$(function() {

    $(document).ready(function () {
        $(".program").on("click", function () {
            window.location('GBR.aspx');
        });
    });

});

</script>

Open in new window


this tells the page to execute this function only after all the html has been loaded.
Avatar of vb9666

ASKER

I don't see how the script is calling the function on the onclick event?
Avatar of vb9666

ASKER

I tried this with javascript and calling a function and it does not work in Mozilla.

<div class="program" style="cursor:pointer;" onclick="javascript:OpenGBR();">
                <div class="programImage"><img src="images/Programs1.gif" style="border:0" alt="AltImage" /></div>
                <div class="programInfo">
                    <div class="programTitle">Heading Text Here</div>
                    <div class="programLine"></div>
                    <div class="programDesc">Text here</div>
                </div>
            </div>

    <script type="text/javascript" language="javascript">
        function OpenGBR()
        {
            window.location('GBR.aspx');
        }
    </script>
Avatar of vb9666

ASKER

I think the issue has something to do with the window.location. It works fine in IE but not Mozilla. If I change the code to window.open then it works in both browsers but I don't want to open a new window.
ASKER CERTIFIED SOLUTION
Avatar of APoPhySpt
APoPhySpt
Flag of Portugal image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial