jQuery: अगले तालिका सेल जाओ खड़ी

Question

मैं jQuery का उपयोग कैसे सेल (td) तुरंत नीचे तक पहुँचने के लिए कर सकते हैं एक पारंपरिक ग्रिड लेआउट html में जब किसी सेल table (यानी, वह होता है जिसमें सभी कोशिकाओं ठीक एक पंक्ति अवधि और स्तंभ)?

मुझे पता है कि निम्नलिखित क्योंकि वे तत्काल भाई बहन हैं क्लिक किया सेल के तत्काल सही करने के लिए सेल करने के लिए nextCell सेट हो जाएगा, लेकिन मैं क्लिक किया सेल ठीक नीचे वाले सेल प्राप्त करने का प्रयास कर रहा हूँ:

$('td').click(function() { 
    var nextCell = $(this).next('td'); 
}); 

अधिमानतः मैं कक्षाओं या आईडी के किसी भी प्रयोग के बिना इसे करना चाहता हूं।

Answer 1

इस प्रयास करें:

$("td").click(function(){ 
    // cache $(this); 
    var $this = $(this); 

    // First, get the index of the td. 
    var cellIndex = $this.index(); 

    // next, get the cell in the next row that has 
    // the same index. 
    $this.closest('tr').next().children().eq(cellIndex).doSomething(); 
}); 

Answer 2

क्या प्रत्येक तालिका पंक्ति में समान संख्या में कोशिकाएं हैं? यदि ऐसा है, तो आप प्रश्न में सेल की "गिनती" प्राप्त कर सकते हैं, फिर next('tr') में संबंधित सेल का चयन करें।

Answer 3

कैसे के बारे में:

$('td').click(function() { 
    var nextCell = $(this).parent().next().find("td:nth-child(whatever)"); 
}); 

Answer 4

$('td').click(function() { 
    var index = $(this).prevAll().length 
    var cellBelow = $(this).parent().next('tr').children('td:nth-child(' + (index + 1) + ')') 
}); 

index वर्तमान पंक्ति में सेल के 0-आधारित सूचकांक (prevAll इस एक से पहले सभी कक्षों को पाता है)।

फिर अगली पंक्ति में, हमें nth-child टीडी इंडेक्स + 1 (nth-child 1 से शुरू होता है, इसलिए + 1) पर मिलता है।

Answer 5

आप चयनकर्ताओं का उपयोग किए बिना यह करने के लिए चाहते हैं, आप कर सकते हैं:

function getNextCellVertically(htmlCell){ 
     //find position of this cell.. 
     var $row = $(htmlCell).parent(); 
     var cellIndex = $.inArray(htmlCell, $row[0].cells); 
     var table = $row.parent()[0]; 
     var rowIndex = $.inArray($row[0], table.rows); 

     //get the next cell vertically.. 
     return (rowIndex < table.rows.length-1) ? 
       table.rows[rowIndex+1].cells[cellIndex] : undefined; 
    } 

    $('td').click(function() { 
     var nextCell = getNextCellVertically(htmlCell); 
     //... 
    }); 

ऐसा नहीं है कि दक्षता यहां महत्वपूर्ण है, लेकिन यह बहुत तेजी से बाहर काम करता है इस तरह यह करने के लिए - 100,000 पुनरावृत्तियों यह था से अधिक टेस्ट मैचों में चयनकर्ता आधारित दृष्टिकोण से 2-5 गुना तेजी से।