一种为多种功能使用相同按钮的方法[关闭]

Question

What I am trying to do is create a notes page, that dynamically retrieves notes from a database. I have it all in a table, with a few columns, but the main feature I need to function, is my problem. I have a series of buttons, each with the same name, but all of them need to open a different note. I tried to use Jquery and Ajax to do it, but I've come up empty. Is there any way to do what I am trying to do?

Answer 1

You could add data to each button, using a data attribute which looks like this: data-{index}="{value}" or to see it more clearly, in the element itself:

<button class="button" data-action="note-1">Save</button>
<button class="button" data-action="note-2">Save</button>

And then process it using jQuery like so:

$('.button').on('click', function () {
    var $this = $(this),
        action = $this.data('action');
    if (action === 'note-1') {
        //load note 1
    }
    // something similar for other notes
});

Here is a relavant jsFiddle http://jsfiddle.net/E8uZb/