Comment obtenir une colonne de table d'index à l'aide de jQuery?

J'ai suffisamment de connaissances à propos de jQuery et de son utilisation, mais aujourd'hui, j'ai eu une peine d'obtenir l'index de colonne de l'étiquette correspondante à l'intérieur de th élément de table à l'aide de jQuery. Je veux obtenir l'index de th élément ayant label texte Mobile. L'indice devrait être de 2 dans ce cas. Je suis l'indice réel, mais ce n'est pas la bonne façon de faire. Donc, je veux savoir pourquoi jQuery ne me donne pas le droit d'index à l'aide de index() méthode.

J'ai aussi écrit le JS Fiddler pour cela.

jQuery

var elem = $('#tbl th');
var rIndex;
alert('Length : ' + elem.length);
var index = elem.filter(
    function(index){
        var labelText = $(this).find('label').text();        
        //alert(index + ' - ' + labelText);
        var result = labelText == 'Mobile';
        if (result)
            rIndex = index;
        return result;
    }).index();
alert("jQuery Index : " + index);
alert("Actual Index : " + rIndex);

HTML

<table id="tbl">
    <tr>
        <td></td>
        <th><label>Application No.</label></th>
        <td></td>
        <th><label>Name</label></th>
        <td></td>
        <th><label>Mobile</label></th>
        <td></td>
        <th><label>Gender</label></th>
    </tr>
</table>

OriginalL'auteur Furqan Safdar | 2013-05-16

  1. 10

    Si aucun argument n'est transmis à l' .méthode index (), la valeur de retour est un entier indiquant la position du premier élément à l'intérieur de l'objet jQuery par rapport à son frère éléments.

    Cela vous donnera l'indice réel
    DÉMO

    elem.each(function(){
    if( $(this).find('label').text()=='Mobile') {
        alert(elem.index(this));
    }
});

    OriginalL'auteur rahul maindargi

  2. 5

    Vous pouvez utiliser rowIndex pour la ligne de l'index et de l'objet d'événement pour obtenir le cellIndex. 

    this.rowIndex //for row index
e.toElement.cellIndex //for column index

    Violon ci-dessous

    Violon Lien

    OriginalL'auteur Manoj Mohandas

  3. 2

    Pour Certains Ref:

    $('input').blur(function() {
    var total_qty = 0;
    var $td = $(this).closest('td');
    var col = $td.parent().children("td").index($td);
    $('table tbody tr').each(function() {
        var $td = $(this).find('td:eq('+col+')');
        var qty = $td.find('input').val();
        if(qty != '') total_qty += qty;
    });
    console.log(total_qty);
});

    OriginalL'auteur WHY

  4. 1
    $('#tbl').find('th').each(function($index){
    if($(this).children('label').html() == 'Mobile')
        alert($index);
})

    OriginalL'auteur Ahmed Abumostafa

  5. 0

    La fonction Index renvoie l'index basé sur la liste que vous fournissez. Dans ce cas, le résultat du filtre.

    Espère que cette aide

    OriginalL'auteur Raimond Kuipers

  6. 0

    "Si aucun argument n'est transmis à l' .méthode index (), la valeur de retour est un entier indiquant la position du premier élément à l'intérieur de l'objet jQuery par rapport à son frère éléments."

    source http://api.jquery.com/index/

    Ci-dessous est un exemple d'utilisation de l'index() pour obtenir le résultat que vous recherchez. Veuillez noter que j'ai ajouté un id de la colonne que vous voulez l'indice de juste pour prendre l'exemple le plus simple, n'hésitez pas à choisir dans une manière que vous désirez.

    <table id="tbl">
    <tr>
        <td></td>
        <th><label>Application No.</label></th>
        <td></td>
        <th><label>Name</label></th>
        <td></td>
        <th id="mobile"><label>Mobile</label></th>
        <td></td>
        <th><label>Gender</label></th>
    </tr>
</table>

var elem = $('#tbl th');
var rIndex;
alert('Length : ' + elem.length);
var index = elem.filter(
    function(index){
        var labelText = $(this).find('label').text();        
        //alert(index + ' - ' + labelText);
        var result = labelText == 'Mobile';
        if (result)
            rIndex = index;
        return result;
    }).index();
alert("jQuery Index : " + index);
alert("Actual Index : " + rIndex);


correctIndex = $('th').index($('#mobile'))

alert("Used correctly :" + correctIndex);

    OriginalL'auteur Sam Shiles

  7. 0

    Un moyen facile de le faire est d'utiliser .prevAll() sur le td, puis sur son parent tr:

    var row = $td.closest('tr').prevAll().length;
var col = $td.prevAll().length;

    ($td being the td elem you are checking)

    démo:
    http://jsfiddle.net/g5s0ex20/2/

    OriginalL'auteur CobaltHex

  8. 0
    $('table th').each(function(i){
    if($($(this).find('label')).html() == "Name"{
       console.log("position= " + i); return false;
    }
});

    OriginalL'auteur user3550446