How do I pass data from a link to a jQuery function?

$(function(){
    $('.tab2').live('click', function() {
      $('#coverTextH3').text(data[1].H3)
      $('#coverTextP').text(data[1].P)
        });
           });

Lets say I have a link <a href="www.link.com"></a> How do I pass data, the index of an array, to a jQuery function so I do not have to repeat my code, for each index [0]-[7]?

 var data = [
 开发者_如何学C   {
        H3: 'name',
            p: 'more'

    },
    {
        H3: 'string',
        p: 'more strings'
     }]

---

There are numerous options. If attaching handlers via javascript, I would select basing on element's id or some custom attribute, not the class. So say you have a number of links like this:

<a href="#" class="tab1" link-number="1">Tab 1</a>
<a href="#" class="tab2" link-number="2">Tab 2</a>
<a href="#" class="tab3" link-number="3">Tab 3</a>        

javascript in this case would be

$(function(){
    $('a[link-number]').live('click', function() {
        var index = $(this).attr('link-number') * 1 - 1;
        $('#coverTextH3').text(data[index].H3)
        $('#coverTextP').text(data[index].P)
    });
});

Alternatively, you can attach click handlers right in your a elements declaration:

<a href="#" class="tab1" onclick="setCover(0)">Tab 1</a>
<a href="#" class="tab2" onclick="setCover(1)">Tab 1</a>
<a href="#" class="tab3" onclick="setCover(2)">Tab 1</a>

and define setCover function like this:

function setCover(index) {
    $('#coverTextH3').text(data[index].H3)
    $('#coverTextP').text(data[index].P)
}

Each of alternatives require changes in your htlm. If for some reason it is not possible, you need to at least now the range of your tabs, which can be quite tricky.

---

Something similar to this should work:

markup:

<a href="www.link.com" data-index="1" id="link1" />

javascript:

$(function(){
    $('#link1').live('click', function() {
      var idx = $(this).data('index');
      $('#coverTextH3').text(data[idx].H3)
      $('#coverTextP').text(data[idx].P)
    });
});

---

if your link IDs correspond to the index order in the array you can do something like this:

example jsfiddle

jQuery:

$(function() {
    $('.tab2').live('click', function(e) {
        e.preventDefault();

        // parse the integer from the ID 
        // and get the 0-based index (by subtracting 1)
        var idx = $(this).attr('id').replace('link', '') * 1 - 1; 

        $('#coverTextH3').text(data[idx].H3)
        $('#coverTextP').text(data[idx].p)
    });
});

HTML:

<a href="#www.link.com" id="link1" class="tab2">Link 1</a>
<a href="#www.link.com" id="link2" class="tab2">Link 2</a>

<h3 id="coverTextH3"></h3>
<p id="coverTextP"></p>

---

<a href="javascript:someFunction(1);">Text</a>

I'm not sure I understand exactly what you're asking. If this doens't fit, please clarify.