Javascript variable not acting global

Question

I'm just learning Javascript after starting out in PHP.

I'm trying some basic stuff, but for some reason the below code doesn't act as I expect. I have researched it, and from what I can tell it should work.

<script type="text/javascript">
showIndex=4;

function test(){
showIndex++;
alert(showIndex);
}
</script>

I am calling the script with an image:

<div style="display:inline-block;margin-left:25px;">';
<a href="" onclick="test()" ><img src="_images/next.png" width="100" />    </a>
</div>

It runs fine the first time, but when I hit the button again, it still has the initial variable plus one. (which makes me think it's acting as a local variable...) It seem so straight forward... what am I doing wrong?

Try to set the href of that link and you'll see why :-)

Bergi
– Bergi

2015-06-20 14:38:55 +00:00
Commented Jun 20, 2015 at 14:38 — Bergi
– Bergi, Commented Jun 20, 2015 at 14:38

Spencer Wieczorek · Accepted Answer · 2015-06-20 14:37:26Z

2

Remove the <a> and have the event on the image, it's refreshing the page. You don't need to have it wrapped in an <a> tag for a onclick event:

<img src="_images/next.png" onclick="test()" width="100" />

answered Jun 20, 2015 at 14:37

Spencer Wieczorek

21.7k7 gold badges46 silver badges57 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Community · Accepted Answer · 2017-05-23 11:58:31Z

0

The empty link just reloads the page. You can insert # in it:

<div style="display:inline-block;margin-left:25px;">
   <a href="#" onclick="test()" >www </a>
</div>

Then everything works as intended.

edited May 23, 2017 at 11:58

CommunityBot

11 silver badge

answered Jun 20, 2015 at 14:38

nicael

19.1k13 gold badges65 silver badges93 bronze badges

Comments

Fisch · Accepted Answer · 2015-06-20 14:45:33Z

0

The empty href attribute on the <a> tag is messing you up. Either remove the href attribute, or change it to # or javascript:void(0)

Alternatively, you can call your method from the href attribute like this

<div style="display:inline-block;margin-left:25px;">';
     <a href="javascript:test()" ><img src="_images/next.png" width="100" />    </a>
</div>

edited Jun 20, 2015 at 14:45

answered Jun 20, 2015 at 14:40

Fisch

3,8151 gold badge30 silver badges38 bronze badges

Collectives™ on Stack Overflow

Javascript variable not acting global

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related