admin管理员组

文章数量:1313001

I am in my second semester at SCSU and currently taking an introductory course into Computer Science. We are going over the basics of HTML and Javascript.

The latest lab I worked on was using a button to change a sad face into a happy face. However, I was wondering if it was possible to check if you have already clicked the button, if so, using an If statement it will pop up an alert saying, "You made me smile!"

<html>
<head>
<title>Are you sad?</title>
</head>

<body>

<div style="text-align:center">
<img id="sadFace" src=".gif">
<p>

<input type="button" value="Smile"
    onclick="document.getElementById('sadFace').src='.gif'; 
    alert('You made me smile!');">
</p>
</div>

</body>
</html>

Presently the program will display the alert when I click the button (this was for extra credit). However, I would like to check if the button has already been pressed, if so it will display the alert.

I am in my second semester at SCSU and currently taking an introductory course into Computer Science. We are going over the basics of HTML and Javascript.

The latest lab I worked on was using a button to change a sad face into a happy face. However, I was wondering if it was possible to check if you have already clicked the button, if so, using an If statement it will pop up an alert saying, "You made me smile!"

<html>
<head>
<title>Are you sad?</title>
</head>

<body>

<div style="text-align:center">
<img id="sadFace" src="http://balance3e./Images/sad.gif">
<p>

<input type="button" value="Smile"
    onclick="document.getElementById('sadFace').src='http://balance3e./Images/happy.gif'; 
    alert('You made me smile!');">
</p>
</div>

</body>
</html>

Presently the program will display the alert when I click the button (this was for extra credit). However, I would like to check if the button has already been pressed, if so it will display the alert.

  • javascript
  • button
  • if-statement
Share Improve this question asked Feb 13, 2014 at 18:47 mccdlibbymccdlibby 1812 gold badges7 silver badges14 bronze badges 1
  • 3 if(document.getElementById('sadFace').src == 'http://balance3e./Images/happy.gif'){alert('clicked')}. I hope that answer your question – Satpal Commented Feb 13, 2014 at 18:49
Add a ment  | 

5 Answers 5

Reset to default 2

I would do it like this:

<html>
<head>
    <title>Are you sad?</title>

    <script>

        function changeFace() {

            if(document.getElementById('sadFace').src == 'http://balance3e./Images/happy.gif') {
                alert('You made me smile!');
            }

            document.getElementById('sadFace').src='http://balance3e./Images/happy.gif';

        }

    </script>

</head>
<body>

    <div style="text-align:center">
    <img id="sadFace" src="http://balance3e./Images/sad.gif">
    <p>
        <input type="button" value="Smile" onclick="changeFace()">
    </p>
    </div>

</body>
</html>

Here is my way:

onclick= "if( i== 0)
         {
           document.getElementById('sadFace').src='http://balance3e./Images/happy.gif'; 
           i++;
          }
          else
          {
             alert('You made me smile!');
          }"

Of course you will have to define the variable i and set its value to zero at first.

You need to create a variable that will keep track of whether this button was pressed. Maybe call this variable "isPressed" and set its default value to false. When you click the button, if the variable's value is false, set it to true. Otherwise, alert out your message. 

<html>
<head>
<title>Are you sad?</title>
</head>
<script>var i =0;</script>
<body>

<div style="text-align:center">
<img id="sadFace" src="http://balance3e./Images/sad.gif">
<p>

<input type="button" value="Smile"
    onclick="
    if(i == 0 ){
i=1;
document.getElementById('sadFace').src='http://balance3e./Images/happy.gif'; 
alert('You made me smile!');
}">
</p>
</div>

</body>
</html>

Try 

onClick = "if(document.getElementById('sadFace').src ==                 
            'http://balance3e./Images/happy.gif')
           {
              alert('You made me smile!');
           }"

本文标签： JavascriptChecking button clicks with If StatementStack Overflow

版权声明：本文标题：Javascript - Checking button clicks with If Statement - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1741887125a2403086.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。