javascript - jQuery replacement for onclick - Stack Overflow

admin管理员组

文章数量:1394174

I've just recently discovered the power of jQuery. Just a quick question though.

What is a replacement for onclick="DeleteSomething('THE ID NUMBER LOADED IN BY SERVER SIDE')" ?

Is there even a way somehow to pass custom information such as an ID to a jQuery onclick? Or do I have to stay with the old fashioned way?

I've just recently discovered the power of jQuery. Just a quick question though.

What is a replacement for onclick="DeleteSomething('THE ID NUMBER LOADED IN BY SERVER SIDE')" ?

Is there even a way somehow to pass custom information such as an ID to a jQuery onclick? Or do I have to stay with the old fashioned way?

• javascript
• jquery
• jquery-events

Share Improve this question Follow edited Dec 23, 2022 at 23:21 Brian Tompsett - 汤莱恩 5,8937272 gold badges6161 silver badges133133 bronze badges asked Nov 25, 2009 at 2:57 AdamAdam 9,4691515 gold badges4949 silver badges6363 bronze badges

Add a ment  | 

7 Answers 7

Sorted by: Reset to default 6

I usually use a rel="" for some extra data i might need attached to the button or whatnot.

for example

<input class="btnDelete" rel="34" value="Delete" />

then in jquery

$('.btnDelete').click(function() {
    DeleteMethod($(this).attr("rel"));
  });

If you stick the ID of the object you want to delete in the rel parameter, you can do it this way:

<script type="text/javascript>

$('a.deleter').click(function(){
   if($(this).attr("rel") != ""){
      DeleteSomething($(this).attr("rel"));
   }
});

</script>
<a href="javascript:void(0)" rel="54" class="deleter">Delete Widget</a>

$(document).ready(function () {
  $('#selector').click(function() {
    //here goes your onclick code
  });
);

Please, post some markup for more help.

Also, you should read the Getting started with jQuery resources, linked in the main page of the library.

In jQuery you would more likely do something like:

$('a').click(function(){
    # code here
});

With 'a' being whatever selector you want to use to find the right link.

In response to your ment:

Probably the best way, as someone else mentioned, would be to provide the dynamic data in one of the attributes of the link:

<a rel="{id}" >

$('a').click(function(){
    deleteFunction($(this).attr('rel'));
});

Instead of this:

<button onclick="DeleteSomething('THE ID NUMBER LOADED IN BY SERVER SIDE')">

Do this:

<button id="thing">
<script>
$(function() {
    $("#thing").click(function() {
        DeleteSomething('THE ID NUMBER LOADED IN BY SERVER SIDE');
    }
}
<script>

It would much cleaner if you do it this way:

<tag class="someclass" prop1="id from serverside" />

$('.someclass').click(function(){
   var prop1 = $(this).attr('prop1');
   //DeleteSomething(prop1)
});

Use the server to replace {ID} with the actual ID.

HTML:

<form id="deleter">
  <input type="hidden" name="id" value="{ID}" \>
  <input type="submit" value="Delete" rel="{ID}" \>
</form>

jQuery:

$('form#deleter input[type="submit"]').click(function() {
  var id = $(this).attr('rel');
  DeleteSomething(id);
  return false;
}

Don't forget to implement the deleting server-side also for people who don't have Javascript enabled!

本文标签： javascriptjQuery replacement for onclickStack Overflow