Javascript 基于ajax中的另一个td名称设置td值

我有以下表格结构：

<tr>
  <td class="name">
    Stock1
  </td>
  <td class="price">

  </td>
</tr>
<tr>
  <td class="name">
      Stock2
  </td>
  <td class="price">

  </td>
</tr>

在这个场景中，

this

不起作用，我希望它是class

name

的

td

标记，其中值是Stock1。如果我将

此

替换为

“.name”

，则该代码仅在有一个

名称时有效。当我有两个带有class
name
的
td
标记时，它就不起作用了

我需要在文档加载后立即完成此操作，而不是在鼠标单击或悬停等事件上。
此
不涉及
td.name
元素或
表

选择包含指定文本的所有元素以
td
为目标，然后使用canuse-use-DOM-relationship以
.next（）
为紧跟其后的同级
td
为目标

或

您还可以使用
.filter（）


根据注释，现在返回一个数组。因此需要迭代
数据
对象并以所需元素为目标

var data = [{
    name: "Stock1",
    price: "$12"
}, {
    name: "Stock2",
    price: "$15"
}]
$.each(data, function(_, d){
    $('td.name').filter(function() {
        return this.textContent.indexOf(d.name) != -1;
    }).closest('tr').find('.price').html(d.price);
})  

此
不涉及
td.name
元素或
表

选择包含指定文本的所有元素以
td
为目标，然后使用canuse-use-DOM-relationship以
.next（）
为紧跟其后的同级
td
为目标

或

您还可以使用
.filter（）


根据注释，现在返回一个数组。因此需要迭代
数据
对象并以所需元素为目标

var data = [{
    name: "Stock1",
    price: "$12"
}, {
    name: "Stock2",
    price: "$15"
}]
$.each(data, function(_, d){
    $('td.name').filter(function() {
        return this.textContent.indexOf(d.name) != -1;
    }).closest('tr').find('.price').html(d.price);
})  

假设数据采用下面提到的格式，则在成功方法中使用下面的代码

success:function(data)
      // Assigning dummy values for assumption
      var data = [{
        stockName: "Stock1",
        price: "$12"
      }, {
        stockName: "Stock2",
        price: "$15"
      }]
     // Iterating throw all td which has name [class] elements
      $(".name").each(function(i, obj) {
        // Dummy Validation as per the mock data to repalce the data as per the stockName
        if ($(this).closest('tr').find('.name').text().trim() === data[i].stockName){
          $(this).closest('tr').find('.price').html(data[i].price);
        }
      })
});

假设数据采用下面提到的格式，则在成功方法中使用下面的代码

success:function(data)
      // Assigning dummy values for assumption
      var data = [{
        stockName: "Stock1",
        price: "$12"
      }, {
        stockName: "Stock2",
        price: "$15"
      }]
     // Iterating throw all td which has name [class] elements
      $(".name").each(function(i, obj) {
        // Dummy Validation as per the mock data to repalce the data as per the stockName
        if ($(this).closest('tr').find('.name').text().trim() === data[i].stockName){
          $(this).closest('tr').find('.price').html(data[i].price);
        }
      })
});

如果您的页面上有多个库存，当前的实现可能无法正常工作。因此，我建议您稍微修改服务器端代码，以返回节点名称（如Stock1）及其价格。因此，您的ajax成功
数据
将有两个组件；比如
data.name
和
data.price
。第一个将用于目标DOM td，然后一个将用于设置价格文本，如下所示：

对于Stock1：

$(document).ready(function() {
     $.ajax({
          *everything else working fine*
          success: function(data) {
               if($('.name').html().indexOf("Stock1") != -1) {
                    $(this).closest('tr').find('.price').html(data);
               }
          }
     });
});

$(document).ready(function(){

    $.ajax({
        url: "someBaseURL?name=Stock1"
        success: function(data) {
            var name = data.name; //grab the stock name
            var price = data.price; //grab the stock price
            //iterate over all the names and target the one associated
            $('.name').each(function(){
                if($.trim($(this).text()).indexOf(name) != -1)
                    $(this).closest('tr').find('.price').html(price);
            });
        }
    });
});

如果页面上存在多个库存，则当前实现可能无法正常工作。因此，我建议您稍微修改服务器端代码，以返回节点名称（如Stock1）及其价格。因此，您的ajax成功
数据
将有两个组件；比如
data.name
和
data.price
。第一个将用于目标DOM td，然后一个将用于设置价格文本，如下所示：

对于Stock1：

$(document).ready(function() {
     $.ajax({
          *everything else working fine*
          success: function(data) {
               if($('.name').html().indexOf("Stock1") != -1) {
                    $(this).closest('tr').find('.price').html(data);
               }
          }
     });
});

$(document).ready(function(){

    $.ajax({
        url: "someBaseURL?name=Stock1"
        success: function(data) {
            var name = data.name; //grab the stock name
            var price = data.price; //grab the stock price
            //iterate over all the names and target the one associated
            $('.name').each(function(){
                if($.trim($(this).text()).indexOf(name) != -1)
                    $(this).closest('tr').find('.price').html(price);
            });
        }
    });
});

是的，但是由于我有两个
td
标记，它们都属于同一个类，jquery不知道选择哪一个，因此无法工作。如何选择值为Stock1的
“.name”
？此
具有ajax对象的范围，而不是您的table@Sojtin如何将
this
的作用域更改为my table，或者以其他任何方式使其工作？您是否打算为每个名称启动
ajax
？或者会有一个
ajax
一次性收回所有价格，然后简单地将每个单独的价格分配给相应的节点？@vijayP会为我所做的每个名称触发ajax，但由于我有两个
td
标签，它们具有相同的类，jquery不知道选择哪一个，因此无法工作。如何选择值为Stock1的
“.name”
？此
具有ajax对象的范围，而不是您的table@Sojtin如何将
this
的作用域更改为my table，或者以其他任何方式使其工作？您是否打算为每个名称启动
ajax
？或者会有一个
ajax
一次性收回所有价格，然后简单地将每个单独的价格分配给相应的节点？@vijayP为每个名称触发ajax如果我使用变量
var1
而不是字符串“Stock1”，我是否简单地将“Stock1”替换为没有qoutes的var1？@BivoKasaju，
$（'td.name:contains（“+var1+”）
我认为for循环和ajax不在一起工作，所以我只获取列表中姓氏的价格。因此，正如@vijayP所建议的，我从服务器返回了ajax中的name和price。如何进行编辑以将其集成到代码中？
success:function（data）
和
data.name
，
data.price
不起作用。对于上述代码，以下服务器端代码是否足够好：
string name=“Stock1”；string price=“15”string[]returndata={name，price}；return Json（returndata，JsonRequestBehavior.AllowGet）；
如果我使用变量
var1
而不是字符串“Stock1”，我是否简单地将“Stock1”替换为不带qoutes的var1？@BivoKasaju，
$（'td.name:contains（“+var1+”））
我认为for循环和ajax不在一起工作，所以我只获取列表中姓氏的价格。因此，正如@vijayP所建议的，我从服务器返回了ajax中的名称和价格。如何进行编辑以将其集成到代码中？
成功：函数（数据）
和
data.name
，
data.price
不起作用。对于上述代码，以下服务器端代码是否足够好：
string name=“Stock1”；string price=“15”string[]returndata={name，price}；return Json（returndata，JsonRequestBehavior.AllowGet）
代码转储无效。请添加几行解释代码转储无效。请添加几行解释如何从服务器返回数据，以什么格式？我使用的是
string name=“Stock1”；string price=“15”；string[]returndata={name，price}；return Json（returndata，JsonRequestBehavior.AllowGet）
这是否适用于上面的代码？您需要像以下那样返回它：
string name=“Stock1”stri