jQuery在tr中获取子文本

Question

Here is the html structure 这是html结构

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table class="table"> <thead> <tr> <th>NAME</th> <th>DES</th> </tr> </thead> <tbody id="sub_mission_list"> <tr> <td>Q1</td> <td> <textarea id="mission_description" name="mission_description">T1</textarea> </td> </tr> <tr> <td>Q2</td> <td> <textarea id="mission_description" name="mission_description">T2</textarea> </td> </tr> </tbody> </table>

I want to get the value in <textarea> 我想在<textarea>获取值

I did and here is my solution, but I don't think it's a good way to do it. 我做了，这是我的解决方案，但我不认为这是一个很好的方法。 What's the best way to achieve that? 实现这一目标的最佳方法是什么？

_.each($('#sub_mission_list tr'), function(value) {
  var describe = $($($(value).children()[1]).children()[0]).val();
  console.log(describe);
});

Answer 1

Use jQuery.each() for iteration, and use .find() to target textarea 使用jQuery.each()进行迭代，并使用.find()来定位textarea

$('#sub_mission_list tr').each(function() {
  var describe = $(this).find('textarea').val();
  console.log(describe);
});

 $('#sub_mission_list tr').each(function() { var describe = $(this).find('textarea').val(); console.log(describe); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <body> <table class="table"> <thead> <tr> <th>NAME</th> <th>DES</th> </tr> </thead> <tbody id="sub_mission_list"> <tr> <td>Q1</td> <td> <textarea id="mission_description" name="mission_description">T1</textarea> </td> </tr> <tr> <td>Q2</td> <td> <textarea id="mission_description" name="mission_description">T2</textarea> </td> </tr> </tbody> </table> </body>

Note: Identifiers in HTML must be unique. 注意：HTML中的标识符必须是唯一的。

Answer 2

You can iterate over the textarea by updating the selector and use each() method to iterate over the jQuery collection. 您可以通过更新选择器迭代textarea并使用each()方法迭代jQuery集合。

// To get the textarea within the second td, update selector
// to more specific `$('#sub_mission_list tr td:nth-child(2) textarea')`
$('#sub_mission_list tr td textarea').each(function() {
  var describe = this.value; // get the text value
  console.log(describe);
});

 // To get the textarea within the second td, update selector // to more specific `$('#sub_mission_list tr td:nth-child(2) textarea')` $('#sub_mission_list tr td textarea').each(function() { var describe = this.value; // get the text value console.log(describe); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <body> <table class="table"> <thead> <tr> <th>NAME</th> <th>DES</th> </tr> </thead> <tbody id="sub_mission_list"> <tr> <td>Q1</td> <td> <textarea id="mission_description" name="mission_description">T1</textarea> </td> </tr> <tr> <td>Q2</td> <td> <textarea id="mission_description" name="mission_description">T2</textarea> </td> </tr> </tbody> </table> </body>

In case you want to get the result as an array then use map() method along with get() method. 如果您想将结果作为数组获取，则使用map()方法和get()方法。

var res = $('#sub_mission_list tr td textarea').map(function() {
  return this.value; // get the text value
}).get();

 var res = $('#sub_mission_list tr td textarea').map(function() { return this.value; // get the text value }).get(); console.log(res);

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <body> <table class="table"> <thead> <tr> <th>NAME</th> <th>DES</th> </tr> </thead> <tbody id="sub_mission_list"> <tr> <td>Q1</td> <td> <textarea id="mission_description" name="mission_description">T1</textarea> </td> </tr> <tr> <td>Q2</td> <td> <textarea id="mission_description" name="mission_description">T2</textarea> </td> </tr> </tbody> </table> </body>

Answer 3

使用文本区域直接$('#sub_mission_list tr td textarea').each(function() {

Answer 4

Use input type selector. 使用输入类型选择器。

 $.each($('#sub_mission_list textarea'), function(value) { var describe =$(this).val(); console.log(describe); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script> <table class="table"> <thead> <tr> <th>NAME</th> <th>DES</th> </tr> </thead> <tbody id="sub_mission_list"> <tr> <td>Q1</td> <td> <textarea id="mission_description" name="mission_description">T1</textarea> </td> </tr> <tr> <td>Q2</td> <td> <textarea id="mission_description" name="mission_description">T2</textarea> </td> </tr> </tbody> </table>

Answer 5

also you can search in table using .find of jquery 你也可以使用.find的jquery在表中搜索

    var getValues = $('#sub_mission_list').find('textarea');

    getValues.each(function(){
        console.log($( this ).val());
    });

jQuery在tr中获取子文本

问题描述

5 个解决方案

解决方案1
2 已采纳 2017-03-07 09:57:33

解决方案2
1 2017-03-07 09:58:15

解决方案3
0 2017-03-07 09:58:58

解决方案4
0 2017-03-07 10:00:19

解决方案5
0 2017-03-07 10:08:48

jQuery在tr中获取子文本

问题描述

5 个解决方案

解决方案1 2 已采纳 2017-03-07 09:57:33

解决方案2 1 2017-03-07 09:58:15

解决方案3 0 2017-03-07 09:58:58

解决方案4 0 2017-03-07 10:00:19

解决方案5 0 2017-03-07 10:08:48

解决方案1
2 已采纳 2017-03-07 09:57:33

解决方案2
1 2017-03-07 09:58:15

解决方案3
0 2017-03-07 09:58:58

解决方案4
0 2017-03-07 10:00:19

解决方案5
0 2017-03-07 10:08:48