使用jquery使用class not id获取一些td行值

getting the some td row values with jquery using class not id

本文关键字：使用 td 行值 id jquery class not 获取      更新时间：2023-09-26

如何使用jquery获得td值?while循环将生成一些具有相同类名的…

<table>
   <?php
   while(...){
   ?>
   <tr>
      <td class="datao">data 0</td>
      <input type="button" class="getValue" value="Delete" />
   </tr>
   <?php
   }
   ?>
</table>
Jquery: 

$(".getValue").click(function(){ $.post("somescript.php", { value:$("data0").val()}, function(data){ alert(data); }); });
更新:

嗯，我正在生成一个表，其中的数据来自数据库。之后，我想从数据库中删除任何行，所以，我把一个按钮附加到每个数据值()这里的问题是获得适当的td值，一旦我在每个按钮和td上使用相同的类名…之后，我将使用AJAX和删除正确的数据行从数据库与PHP。

更新:

生成的代码看起来像这样: 
<table>
       <tr>
          <td class="datao">xzczxc</td>
          <input type="button" class="getValue" value="Delete" />
          <td class="datao">gfh+pso</td>
          <input type="button" class="getValue" value="Delete" />
          <td class="datao">sdhgfjgk</td>
          <input type="button" class="getValue" value="Delete" />
          <td class="datao">asdghdas</td>
          <input type="button" class="getValue" value="Delete" />
          <td class="datao">egfcn</td>
          <input type="button" class="getValue" value="Delete" />
          <td class="datao">sdfds..k</td>
          <input type="button" class="getValue" value="Delete" />
          <td class="datao">6ytytu</td>
          <input type="button" class="getValue" value="Delete" />
          <td class="datao">tyghj0</td>
          <input type="button" class="getValue" value="Delete" />
          <td class="datao">daghjgh0</td>
          <input type="button" class="getValue" value="Delete" />
          <td class="datao">dagh0</td>
          <input type="button" class="getValue" value="Delete" />
          <td class="datao">dada0</td>
          <input type="button" class="getValue" value="Delete" />
          <td class="datao">dasa</td>
          <input type="button" class="getValue" value="Delete" />
       </tr>
</table>

如何删除例如第四行?还是第五个?

我只想在按下按钮时获得td值，并将这些值传递给php脚本。

我想传递一些td值ajax调用时，按下按钮"删除"

<table>
       <tr>
          <td class="datao">first column</td>
          <td class="data1">first column</td>
          <td class="data2">first column</td>
          <td colspan="2"></td>
       </tr>
       <tr>
          <td class="datao">jkhghj</td>
          <td class="data1">dsfg</td>
          <td class="data2">iouhfg</td>
          <input type="button" class="deleteRow" value="Delete" />
       </tr>
       <tr>
          <td class="datao">hgjdss</td>
          <td class="data1">oiuy</td>
          <td class="data2">qweasd</td>
          <input type="button" class="deleteRow" value="Delete" />
       </tr>
       <tr>
          <td class="datao">aweda</td>
          <td class="data1">asd</td>
          <td class="data2">asd</td>
          <input type="button" class="deleteRow" value="Delete" />
       </tr>
       <tr>
          <td class="datao">asdasvg</td>
          <td class="data1">esw</td>
          <td class="data2">ee</td>
          <input type="button" class="deleteRow" value="Delete" />
       </tr>
       <tr>
          <td class="datao">qw</td>
          <td class="data1">zdg</td>
          <td class="data2">lykj</td>
          <input type="button" class="deleteRow" value="Delete" />
       </tr>
</table>

您可以使用map()函数获取所有匹配元素的文本，如下所示:

var values = $('td.datao').map(function() {
    return $(this).text();
}).get();

最后的get()返回一个普通的javascript数组，而不是jquery包装的数组。

FCC-PT正确:

$("data0")[0].val()将给出第一个条目值。您需要循环或each()它们以获得值列表。但是你需要提供更多的上下文来理解你在做什么。

假设您想要单独的值:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript"><!--
jQuery(function($){
    $("button").click(function(){
        var values = [];
        $("table td.datao").each(function(){
            values.push( $(this).text() );
        });
        alert(values.join("'n"));
    });
});
//--></script>
</head>
<body>
<table>
    <tr><td class="datao">data 0</td></tr>
    <tr><td class="datao">data 1</td></tr>
    <tr><td class="datao">data 2</td></tr>
    <tr><td class="datao">data 3</td></tr>
    <tr><td class="datao">data 4</td></tr>
</table>
<button>Get values</button>
</body>
</html>

阅读评论，似乎您想要一个特定的值。

使用.eq:

$(".datao:eq(0)").val(); // first one

然而，它是datao还是data0和data1等?示例HTML输出会很有帮助。

我希望我能更好地理解你。 
$(".getValue").click(function(){
    $.post("somescript.php", { value: $(this).parent().find('td').html() },
                               function(data){
                                    alert(data);
                               });
});

看起来好像没有人对我的问题给出一个恰当的答案，无论如何，我要感谢你们所有人的投入。

我已经工作了，发现了一种方法不完美，但工作正常…

假设我想要获取input, select或tr中的任何其他值…

$('input.buttonClass').live('click', function() {
        var valuesArray = [];
        $(this).closest('tr').find("select").each(function() {
            valuesArray.push($(this).attr('value'));
        });
        $.post("script.php", { somename:valuesArray[0], otherName:valuesArray[1] }, function(data) {
                do something in here with the returned data!
            });
        }
    });

在上面的代码中，tr内部的select标记的值将存储在数组中，并与ajax调用一起传递给php脚本。要存储来自其他输入类型的值，如input type="text"，这样做:…找到("选择、输入(type =文本)"),每…我希望有人能在我的工作上得到帮助。谢谢大家。

相关文章：