সারণি সারি এবং jQuery এ কলাম নম্বর

Question

আমি কীভাবে jQuery ব্যবহার করে ক্লিক করা সারণী ঘরের সারি এবং কলাম নম্বর পেতে পারি?

$("td").onClick(function(event){
   var row = ...
   var col = ...
});

Answer 1

আপনি প্রদত্ত প্রসঙ্গে কোর / ইনডেক্স ফাংশনটি ব্যবহার করতে পারেন , উদাহরণস্বরূপ আপনি কলাম নম্বর পেতে তার মূল টিআর এর টিডির সূচকটি পরীক্ষা করতে পারেন এবং সারণির নম্বর পেতে আপনি টেবিলে টিআর সূচকটি পরীক্ষা করতে পারেন:

$('td').click(function(){
  var col = $(this).parent().children().index($(this));
  var row = $(this).parent().parent().children().index($(this).parent());
  alert('Row: ' + row + ', Column: ' + col);
});

এখানে একটি চলমান উদাহরণ পরীক্ষা করুন ।

Comments

কেন এটি @ কলামের কলামগুলিতে ব্যর্থ হয়?

— আর্লিপোস্টার

@ ফোরকরুল আসাইল, @ সিএমএস এটি jsbin.com/eyeyu/1099/edit#preview দিয়ে ব্যর্থ হয়েছে "12" পাঠ্য সহ ROWSPAN's সেলটিতে ক্লিক করুন । কলাম সূচী 4

— অ্যান্ড্রু ডি

ভেরিয়েবল "ডেটা" তে আমার কিছু ডেটা আছে ..... এই কোল এবং সারি মান সহ টেবিলের মধ্যে এই "ডেটা" যুক্ত করা সম্ভব

— শনিশ

ROWSPAN & COLSPAN চারপাশের কাজ: স্প্যানটি jsbin.com/eyeyu/1307/edit

— eddyparkinson

var row = $(this).closest('tr').index()

— SpYk3HH

Answer 2

$('td').click(function() {
    var myCol = $(this).index();
    var $tr = $(this).closest('tr');
    var myRow = $tr.index();
});

Answer 3

ক্লিকে কলাম ইন্ডেক্স পান:

$(this).closest("td").index();

ক্লিকে ROW INDEX পান:

$(this).closest("tr").index();

Answer 4

আমার মাথার শীর্ষে, একটি উপায় হ'ল পূর্ববর্তী সমস্ত উপাদানগুলি ধরে ফেলা এবং তাদের গণনা করা।

$('td').click(function(){ 
    var colIndex = $(this).prevAll().length;
    var rowIndex = $(this).parent('tr').prevAll().length;
});

Answer 5

আপনি টেবিলটি তৈরি করার সময় আপনি কি সেই কোষগুলিতে সেই ডেটা আউটপুট দিতে পারেন?

সুতরাং আপনার টেবিলটি দেখতে এমন হবে:

<table>
  <thead>...</thead>
  <tbody>
    <tr><td data-row='1' data-column='1'>value</td>
      <td data-row='1' data-column='2'>value</td>
      <td data-row='1' data-column='3'>value</td></tr>

  <tbody>
</table>

তাহলে এটি একটি সাধারণ বিষয় হবে

$("td").click(function(event) {
   var row = $(this).attr("data-row");
   var col = $(this).attr("data-col");
}

Comments

এইচটিএমএল স্পেকগুলি এই বৈশিষ্ট্যগুলি মেনে চলে? আমি তাদের খুঁজে পাওয়া যাবে না।

— সামান্থা ব্রানহাম

এইচটিএমএল স্পেক 5, যা উপসর্গ 'ডেটা-' দিয়ে শুরু করে কাস্টম বৈশিষ্ট্যের জন্য অনুমতি দেয়।

— ক্রিস ব্র্যান্ডসমা 15

যদিও তারা অনুমানে নেই এটি পুরানো ব্রাউজারগুলিকে ভাঙবে না <HTML5

— ড্যানিয়েল পাওয়েল

আপনি কেবল কল করে "ডেটা" ক্ষেত্রগুলি অ্যাক্সেস করতে পারেন: $ (এটি) .ডাটা ('সারি');

— হোয়াইটএঞ্জেল

Answer 6

একটি ক্লিক হ্যান্ডলারের পুরো টেবিলের সাথে আবদ্ধ করা এবং তারপরে ক্লিক করা টিডি পাওয়ার জন্য ইভেন্ট.টারাজেট ব্যবহার করা ভাল। এটির 1:20 am হিসাবে আমি এটি যুক্ত করতে পারি তার সবই ts

Comments

সমস্যাটি সমাধান করার জন্য এটি মূল্যবান ইঙ্গিত হতে পারে, তবে একটি উত্তরের উত্তরও সমাধানটি প্রদর্শন করে। আপনার অর্থটি বোঝাতে উদাহরণ কোড সরবরাহ করতে দয়া করে সম্পাদনা করুন । বিকল্পভাবে, পরিবর্তে এটি মন্তব্য হিসাবে বিবেচনা করুন।

— টবি স্পাইট

ধন্যবাদ, আমি এই উত্তরটি আরও 10 বছরে সংশোধন করার বিষয়ে বিবেচনা করব

— mkoryak