Tekshiruv qutisi har safar bir xil satrda tekshirilganda ma'lum bir ID bilan td matni oling

Agar td matnini tasdiqlash qutisi bilan bir xil satrda olish uchun usul bormi?

Masalan, bu jadvalda:

<tr id="1">
    <td id="date"> Mon, 20 Feb 2017 </td>
    <td id="from" >[email protected] </td>
    <td id="subject"> Hello World! </td>
    <td> <input id ={{d.id}} type="checkbox" name="mycheckbox"/> </td>
</tr>
<tr id="2">
    <td id="date"> Sun, 19 Feb 2017 </td>
    <td id="from" >[email protected] </td>
    <td id="subject"> Hello again World! </td>
    <td> <input id ={{d.id}} type="checkbox" name="mycheckbox"/> </td>
</tr>

Ikkinchi qatordagi katakchani bossangiz, men "Qayta yana olam" deb nomlangan ushbu satr mavzusini ogohlantirmoqchiman.

Hozirgacha .parent() , .siblings() va eng yaqin() bilan harakat qildim.

0
Bu {{...}} nima? Handlebars kabi narsalarni ishlatasizmi?
qo'shib qo'ydi muallif Pablo Lozano, manba
Sizda noto'g'ri identifikator identifikatorlari mavjud!
qo'shib qo'ydi muallif ibrahim mahrir, manba

10 javoblar

Men shu tarzda foydalanardim:

<table id="table">
<tr>
    <td> Mon, 20 Feb 2017 </td>
    <td>[email protected] </td>
    <td class="subject"> Hello World! </td>
    <td> <input type="checkbox" /> </td>
</tr>
<tr>
    <td> Sun, 19 Feb 2017 </td>
    <td>[email protected] </td>
    <td class="subject"> Hello again World! </td>
    <td> <input type="checkbox" /> </td>
</tr>  
</table>
<script>
  $('#table').on('click',':checkbox',function(){
    alert($(this).closest('tr').find('.subject').text());
  });
</script>

PS: Bu ish uchun aniq bo'lmagan hamma ma'lumot yo'q

id attribute must be unique over whole html document, never use same id for multiple elements.

1
qo'shib qo'ydi

Buni men o'zimning shaxsiy ma'lumotlarimdan foydalanmoqdaman ("id" bilan bog'liq muammolarni sizning kodingizdan o'zgartiraman).

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false"> <div class="snippet-code">

$("input[name='mycheckbox']").click(function(event){
  var row=$(event.target).data('row');
  console.log(row);
  var subject=$('#'+row+' .subject').text();
  console.log(subject);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr id="1">
    <td class="date"> Mon, 20 Feb 2017 </td>
    <td class="from" >[email protected] </td>
    <td class="subject"> Hello World! </td>
    <td> <input type="checkbox" name="mycheckbox" data-row="1"/> </td>
</tr>
<tr id="2">
    <td class="date"> Sun, 19 Feb 2017 </td>
    <td class="from" >[email protected] </td>
    <td class="subject"> Hello again World! </td>
    <td> <input type="checkbox" name="mycheckbox" data-row="2"/> </td>
</tr>
</table>
</div> </div>
1
qo'shib qo'ydi

Buni men o'zimning shaxsiy ma'lumotlarimdan foydalanmoqdaman ("id" bilan bog'liq muammolarni sizning kodingizdan o'zgartiraman).

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false"> <div class="snippet-code">

$("input[name='mycheckbox']").click(function(event){
  var row=$(event.target).data('row');
  console.log(row);
  var subject=$('#'+row+' .subject').text();
  console.log(subject);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr id="1">
    <td class="date"> Mon, 20 Feb 2017 </td>
    <td class="from" >[email protected] </td>
    <td class="subject"> Hello World! </td>
    <td> <input type="checkbox" name="mycheckbox" data-row="1"/> </td>
</tr>
<tr id="2">
    <td class="date"> Sun, 19 Feb 2017 </td>
    <td class="from" >[email protected] </td>
    <td class="subject"> Hello again World! </td>
    <td> <input type="checkbox" name="mycheckbox" data-row="2"/> </td>
</tr>
</table>
</div> </div>
1
qo'shib qo'ydi

Yaroqli HTML-dagi identifikatorning dublikati bo'lmasligi kerak. Id-ni sinfi bilan almashtirib, html-ni yangiladim.

Buni ko'ring

$(document).ready(function() {
  $("input:checkbox").change(function(index){  
   alert($(this).closest('tr').find('td.subject').text())
  });
})

Ishqiy fiddle

1
qo'shib qo'ydi
Nishon element id identifikatori bo'lsa, eng yaqin ('tr') uchun nima kerak. toping ('# mavzu') kifoya. Bundan tashqari, HTML ning ba'zi idlari bor.
qo'shib qo'ydi muallif Mohammad, manba
$ ('# mavzu'). matn() . jsfiddle.net/o2gxgz9r/3367 ga qarang.
qo'shib qo'ydi muallif Mohammad, manba
Siz yuqorida ishlaydigan ishbilarmonni bera olasizmi?
qo'shib qo'ydi muallif ssilas777, manba
ikkala ogohlantirish ham bir xil mavzu matnini ko'rsatmoqda, bu noto'g'ri. Yaxshiyamki, men tushundim, Id noaniq bo'lib, u noto'g'ri.
qo'shib qo'ydi muallif ssilas777, manba
Ha, yuqoridagi kod ishlaydi, lekin tegishli HTML-da takroriy Id bo'lishi shart emas. kelgusida kodingizni saqlab qolish qiyin kechadi. shunga o'xshash stsenariylarni bajarish uchun id o'rniga sinfdan foydalaning.
qo'shib qo'ydi muallif ssilas777, manba
aslida yuqoridagi kod mening uchun juda yaxshi ishlaydi. Men "id" dan "td" ga ega bo'lish uchun foydalanar edim va hozir "id" mavzusi bilan "td" dan qanday foydalanishni bilaman.
qo'shib qo'ydi muallif Danae Vogiatzi, manba
Ha, tushundim! rahmat!
qo'shib qo'ydi muallif Danae Vogiatzi, manba

Yaroqli HTML-dagi identifikatorning dublikati bo'lmasligi kerak. Id-ni sinfi bilan almashtirib, html-ni yangiladim.

Buni ko'ring

$(document).ready(function() {
  $("input:checkbox").change(function(index){  
   alert($(this).closest('tr').find('td.subject').text())
  });
})

Ishqiy fiddle

1
qo'shib qo'ydi
Nishon element id identifikatori bo'lsa, eng yaqin ('tr') uchun nima kerak. toping ('# mavzu') kifoya. Bundan tashqari, HTML ning ba'zi idlari bor.
qo'shib qo'ydi muallif Mohammad, manba
$ ('# mavzu'). matn() . jsfiddle.net/o2gxgz9r/3367 ga qarang.
qo'shib qo'ydi muallif Mohammad, manba
Siz yuqorida ishlaydigan ishbilarmonni bera olasizmi?
qo'shib qo'ydi muallif ssilas777, manba
ikkala ogohlantirish ham bir xil mavzu matnini ko'rsatmoqda, bu noto'g'ri. Yaxshiyamki, men tushundim, Id noaniq bo'lib, u noto'g'ri.
qo'shib qo'ydi muallif ssilas777, manba
Ha, yuqoridagi kod ishlaydi, lekin tegishli HTML-da takroriy Id bo'lishi shart emas. kelgusida kodingizni saqlab qolish qiyin kechadi. shunga o'xshash stsenariylarni bajarish uchun id o'rniga sinfdan foydalaning.
qo'shib qo'ydi muallif ssilas777, manba
aslida yuqoridagi kod mening uchun juda yaxshi ishlaydi. Men "id" dan "td" ga ega bo'lish uchun foydalanar edim va hozir "id" mavzusi bilan "td" dan qanday foydalanishni bilaman.
qo'shib qo'ydi muallif Danae Vogiatzi, manba
Ha, tushundim! rahmat!
qo'shib qo'ydi muallif Danae Vogiatzi, manba

Bu jqueryasiz ishlaydi

Array.prototype.slice.call(
   document.querySelectorAll('[type="checkbox"]')
).forEach(
   function(i){
      i.onclick = function(){
         alert(this.parentElement.parentElement.querySelector('#subject').innerHTML)
      }
});

https://jsfiddle.net/jvhdx85u/

0
qo'shib qo'ydi

Id identifikatori hujjatda yagona bo'lishi kerak. Buning o'rniga sinf atributidan foydalanishingiz mumkin. Biroq, pastki kod bilan maqsad elementni tanlashingiz mumkin.

$("#2 [name='mycheckbox']").click(function(){
  alert($(this).parent().prev().text());
});

<div class="snippet" data-lang="js" data-hide="true" data-console="true" data-babel="false"> <div class="snippet-code snippet-currently-hidden">

$("#2 [name='mycheckbox']").click(function(){
  console.log($(this).parent().prev().text());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr id="1">
  <td id="date"> Mon, 20 Feb 2017 </td>
  <td id="from" >[email protected] </td>
  <td id="subject"> Hello World! </td>
  <td> <input id ={{d.id}} type="checkbox" name="mycheckbox"/> </td>
</tr>
<tr id="2">
  <td id="date"> Sun, 19 Feb 2017 </td>
  <td id="from" >[email protected] </td>
  <td id="subject"> Hello again World! </td>
  <td> <input id ={{d.id}} type="checkbox" name="mycheckbox"/> </td>
</tr>
</table>
</div> </div>
0
qo'shib qo'ydi

Id identifikatori hujjatda yagona bo'lishi kerak. Buning o'rniga sinf atributidan foydalanishingiz mumkin. Biroq, pastki kod bilan maqsad elementni tanlashingiz mumkin.

$("#2 [name='mycheckbox']").click(function(){
  alert($(this).parent().prev().text());
});

<div class="snippet" data-lang="js" data-hide="true" data-console="true" data-babel="false"> <div class="snippet-code snippet-currently-hidden">

$("#2 [name='mycheckbox']").click(function(){
  console.log($(this).parent().prev().text());
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr id="1">
  <td id="date"> Mon, 20 Feb 2017 </td>
  <td id="from" >[email protected] </td>
  <td id="subject"> Hello World! </td>
  <td> <input id ={{d.id}} type="checkbox" name="mycheckbox"/> </td>
</tr>
<tr id="2">
  <td id="date"> Sun, 19 Feb 2017 </td>
  <td id="from" >[email protected] </td>
  <td id="subject"> Hello again World! </td>
  <td> <input id ={{d.id}} type="checkbox" name="mycheckbox"/> </td>
</tr>
</table>
</div> </div>
0
qo'shib qo'ydi

buning uchun hiyla ishlatishingiz mumkin (ko'pincha boshqa hollarda men ko'pincha foydalanadigan)

  <tr id="1">
        <td id="date"> Mon, 20 Feb 2017 </td>
        <td id="from" >[email protected] </td>
        <td id="subject_t1"> Hello World! </td> <!--check the subject id and input id-->
        <td> <input id ="t1" class="your_class" type="checkbox" name="mycheckbox"/> </td>
    </tr>
    <tr id="2">
        <td id="date"> Sun, 19 Feb 2017 </td>
        <td id="from" >[email protected] </td>
        <td id="subject_t2"> Hello again World! </td>
        <td> <input id ="t2" class="your_class" type="checkbox" name="mycheckbox"/> </td>
    </tr>

Bu erda siz foydalanishingiz mumkin jquery.

<script>$(document).on('click','.your_class',function(){
 var checkbox_id = $(this).attr('id'); //getting id of this clicked checkbox
 var subject_id = "#subject_"+checkbox_id; //making subject id from this as we already made a simple pattern for the id of subject
alert($(subject_id).text()); //i am using the text in alertbox you can do what you want with it
});
0
qo'shib qo'ydi

buning uchun hiyla ishlatishingiz mumkin (ko'pincha boshqa hollarda men ko'pincha foydalanadigan)

  <tr id="1">
        <td id="date"> Mon, 20 Feb 2017 </td>
        <td id="from" >[email protected] </td>
        <td id="subject_t1"> Hello World! </td> <!--check the subject id and input id-->
        <td> <input id ="t1" class="your_class" type="checkbox" name="mycheckbox"/> </td>
    </tr>
    <tr id="2">
        <td id="date"> Sun, 19 Feb 2017 </td>
        <td id="from" >[email protected] </td>
        <td id="subject_t2"> Hello again World! </td>
        <td> <input id ="t2" class="your_class" type="checkbox" name="mycheckbox"/> </td>
    </tr>

Bu erda siz foydalanishingiz mumkin jquery.

<script>$(document).on('click','.your_class',function(){
 var checkbox_id = $(this).attr('id'); //getting id of this clicked checkbox
 var subject_id = "#subject_"+checkbox_id; //making subject id from this as we already made a simple pattern for the id of subject
alert($(subject_id).text()); //i am using the text in alertbox you can do what you want with it
});
0
qo'shib qo'ydi
Javascript UZB
Javascript UZB
99 ishtirokchilar

@js_uzb @vuejs_uz @react_uz @nodejs_uz @angular_uz @ngTashkent @yiiframework_uz @laravel_uz @linux_uzbek @python_uz @swift_uzb —————— @uzdevgroup @UzGeeksGroup ——— @UzDev_Jobs @jobs_uzb