onclick HTML和jQuery不起作用

Question

I have a problem with my jQuery and html code, when I click in the <a> element that contains the onclick event nothing happens.

This is the html code

<a href='http://gomusic.designerbh.com/profile/bar_53d6af107ee03/'>Cabana</a>
<a href='javascript:void(0)' onclick='actus("actuevent_53d6e48c65b68")' style='float:right;width:24px;height:12px;background:url(http://gomusic.designerbh.com/img/arrow.png) no-repeat bottom center'></a>
<span style='float:right;color:#ccc;margin:0px 10px 0px 0px'>49 Minutes ago</span>
<div class='actusevent_53d6e48c65b68' style='z-index:1;position:absolute;width:200px;padding:10px;background:#fff;margin:10px 0px 0px 260px;border:1px solid #ccc;border-radius:5px'>content here</div>

This is the JS code, when I use this code nothing happens

function actus(b){
    $(".actus"+b).hide();
}

But when I do this the code alerts the value 122 and works fine

function actus(b){
    alert('122');
}

I already debugged it. I'm using the latest version of Chrome and jquery-1.9.1.min.js

Answer 1

you have wrong select javascript, try

function actus(b){
            $(".actus"+b).hide();
        }

  onclick='actus("event_53d6e48c65b68")'

Answer 2

Your parameter value is different from the name of your class.

Note onclick='actus("actuevent_53d6e48c65b68")' and class='actusevent_53d6e48c65b68' .

Another thing: the element you're trying to get in actus() would certainly not match your parameter value. i suggest you change your parameter value to start with "event_" instead of "actuevent_", or you can change the prefix of the element in actus() to be: $(".actusevent_") .

Answer 3

EDIT To Barmars comment below - you could simply split it:

function actus(b){
    var i = b.split('_');
    $(".actusevent_"+b[1]).hide();
}

---

Look at your class name, it includes an underscore - _ . What you want is this:

function actus(b){
    $(".actusevent_"+b).hide();
}

---

Errors:

• You're trying to call $('.actus' + b).hide() when your class is actually called actusevent .
• You're also missing the _ in your jQuery function. So it won't ever work.

There are more efficient ways of doing this. If you have control over how you create your DOM elements, you could create something like this:

<a href='javascript:void(0)' id="my-link" data-actus-event='53d6e48c65b68' style='float:right;width:24px;height:12px;background:url(http://gomusic.designerbh.com/img/arrow.png) no-repeat bottom center'></a>

Now create your bind:

$(document).on('click', 'a#my-link', function(e){
    e.preventDefault();
    var actusevent = $(this).data('actus-event');

    $('.actusevent_' + actusevent).hide();
});