CODEWITHSUNDEEP
javascript
Joseph
Joseph

Reputation: 348

HTML javascript function call

Can someone tell me why is the call to my function hideShow not working ?

<a id='plusMinus0' href='#' title='Afficher la liste des messages d erreurs' onclick='hideShow(0);'>

function hideShow(number){
     alert("i am here");
     $('#errMsgGroup'+number).toggle('slow', function() {
         if($('#plusMinus'+number).children('img').attr('src').indexOf('images/NORIA_minus.JPG') >= 0){
                $('#plusMinus'+number).children('img').attr('src', 'images/NORIA_plus.JPG');
                $('#plusMinus'+number).children('img').attr('title', 'hide errors');        
            }
            else{
                $('#plusMinus'+number).children('img').attr('src', 'images/NORIA_minus.JPG');
                $('#plusMinus'+number).children('img').attr('title', 'show errors');
            }
        });
     }

Upvotes: 0

Views: 104

Answers (5)

speti43
speti43

Reputation: 3046

Try this:

<a id='plusMinus0' href='#' onclick="hideShow(0)">Test</a>

<script>
  function hideShow(number) {
     alert(number);
  }
</script>

JSFiddle

EDIT:

I think it's more elegant to handle the event with JQuery:

with JQuery

<a id='plusMinus0' href='#'>Test</a>

<script>
    $(function() {
       $("#plusMinus0").click(function() {
           alert("pass parameter from an attribute " + $(this).attr("id"))
       });
    });
</script>

With # in href, after click your anchor navigates to top of page, to avoid this:

<a id='plusMinus0' href='javascript:;'>Test</a>

or leave the href attribute: Without href

Upvotes: 0

Raghurocks
Raghurocks

Reputation: 925

Try this

<html>
<head>
    <script type="text/javascript">
        function hideShow(number) {
            alert("i am here");
            $('#errMsgGroup' + number).toggle('slow', function () {
                if ($('#plusMinus' + number).children('img').attr('src').indexOf('images/NORIA_minus.JPG') >= 0) {
                    $('#plusMinus' + number).children('img').attr('src', 'images/NORIA_plus.JPG');
                    $('#plusMinus' + number).children('img').attr('title', 'hide errors');
                }
                else {
                    $('#plusMinus' + number).children('img').attr('src', 'images/NORIA_minus.JPG');
                    $('#plusMinus' + number).children('img').attr('title', 'show errors');
                }
            });
        }
    </script>
</head>
<body>
    <a id='plusMinus0' href='#' title='Afficher la liste des messages d erreurs' onclick='hideShow(0);'>Check</a>
</body>


</html>

Upvotes: 0

DickieBoy
DickieBoy

Reputation: 4956

In addition to @sonusindhu and @putvande answers. You probably want a return false at the end of your javascript.

function hideShow(number){
  alert("i am here");
  $('#errMsgGroup'+number).toggle('slow', function() {
    if($('#plusMinus'+number).children('img').attr('src').indexOf('images/NORIA_minus.JPG') >= 0){
    $('#plusMinus'+number).children('img').attr('src', 'images/NORIA_plus.JPG');
       $('#plusMinus'+number).children('img').attr('title', 'hide errors');        
    }
    else{
      $('#plusMinus'+number).children('img').attr('src', 'images/NORIA_minus.JPG');
      $('#plusMinus'+number).children('img').attr('title', 'show errors');
    }
  });
  return false;
}

Upvotes: 0

putvande
putvande

Reputation: 15213

I guess you need to close your A-tag as well like <a id='plusMinus0' href='#' title='Afficher la liste des messages d erreurs' onclick='hideShow(0);'>hide / show</a>

Upvotes: 0

Sonu Sindhu
Sonu Sindhu

Reputation: 1792

put your function within <script></script> tag

Like

<script>


function hideShow(number){
     alert("i am here");
     $('#errMsgGroup'+number).toggle('slow', function() {
         if($('#plusMinus'+number).children('img').attr('src').indexOf('images/NORIA_minus.JPG') >= 0){
                $('#plusMinus'+number).children('img').attr('src', 'images/NORIA_plus.JPG');
                $('#plusMinus'+number).children('img').attr('title', 'hide errors');        
            }
            else{
                $('#plusMinus'+number).children('img').attr('src', 'images/NORIA_minus.JPG');
                $('#plusMinus'+number).children('img').attr('title', 'show errors');
            }
        });
     }

</script>

Upvotes: 1

Related Questions