Javascript 单击行按钮时如何获取订单号和选定值

我有一个如下结构的表，我希望用户在查看详细信息按钮上单击

onclick

，从数组中的

combobox

获取订单id的值和所选选项的值，以便在ajax中使用它来更新数据库，这是如何做到的

订单号。
客户名称
订单状态
4.
杰克
按进度交货取消
看法
5.
阿德尔
按进度交货取消
看法
6.
阿里
按进度交货取消
看法

试试这个

$（文档）。在（'单击'，'上。查看详细信息'，函数（）{
p=$（此）.parents（“tr”）
order_id=p.find（“td:first”）.html（）
选择值=p.find（“选择”）.val（）
警报（“订单id:+订单id+”选定：“+选择值”）
})

订单号。
客户名称
订单状态
4.
杰克
按进度交货取消
看法
5.
阿德尔
按进度交货取消
看法
6.
阿里
按进度交货取消
看法

这可能就是您要找的。这将从按下按钮的行中获取select的id和选定值

function ViewDetails(obj) {
  var $obj = $(obj);
  var id, option;

  id = $obj.closest("tr").find("td:eq(0)").text();
  option = $obj.closest("tr").find("td:eq(2) select").val();

  console.log(id + " | " + option)
}

请注意，我将此添加到了

onclick=“ViewDetails（）”

，

onclick=“ViewDetails（this）”

演示

功能视图详细信息（obj）{
变量$obj=$（obj）；
var-id，选项；
id=$obj.closest（“tr”）.find（“td:eq（0）”）.text（）；
option=$obj.closest（“tr”）.find（“td:eq（2）select”）.val（）；
console.log（id+“|”+选项）
}

订单号。
客户名称
订单状态
4.
杰克
按进度交货取消
查看详细信息
5.
阿德尔
按进度交货取消
查看详细信息
6.
阿里
按进度交货取消
查看详细信息

将

onclick=“ViewDetails（）”

更改为

onclick=“ViewDetails（this）”

，这样您就可以将DOM元素传递给您的函数

现在，您的功能：

function ViewDetails(buttonEl) {
    var row = buttonEl.closest('tr'); // here you'll get your row
    var orderId = row.getElementsByTagName('td')[0].textContent; //order id
    var status = row.getElementsByTagName('select')[0].value; //status
}

函数视图详细信息（按钮）{
var row=buttonEl.closest（'tr'）；//这里是您的行
var orderId=row.getElementsByTagName（'td'）[0]。textContent；//订单id
var status=row.getElementsByTagName（'select'）[0]。值；//状态
console.log（orderId+“”+状态）；
}

订单号。
客户名称
订单状态
4.
杰克
按进度交货取消
5.
阿德尔
按进度交货取消
6.
阿里
按进度交货取消

在html中：

onclick="ViewDetails(this)"

js:

---

向包含orderId的每个

td

添加一个公共

类

，并向每个

select

元素添加一个公共

类

。然后使用jquery查找父级

tr

&使用

find

方法获取值

函数视图详细信息（elem）{
//查找父tr，然后查找orderId的td
var orderId=$（elem.parent（）.parent（）.find（'.odId'）.text（）.trim（）；
//从下拉列表中获取所选选项
var selectedOption=$（elem.parent（）.parent（）.find（'.selected'）.val（）；
console.log（orderId，selectedOption）
}

订单号。
客户名称
订单状态
4.
杰克
按进度交货取消
点击
5.
阿德尔
按进度交货取消
点击
6.
阿里
按进度交货取消
点击

问题出在哪里？首先，您有多个具有相同id的元素，这是一种不好的做法，请使用类。其次，请向我们展示您迄今为止尝试过的jquery代码。首先，不建议在一个页面上使用相同的

id

s只需在ViewDetails[ViewDetails（order_id）like this]函数中传递订单id，并在将这些值放入行时将其放在那里。@NewPHP在此处尝试我的解决方案类型“hrml”

function ViewDetails(_el){
    var orders_id=$(_el).parent().parent().find("td:first").html();
    alert(orders_id);
    ////////...........
}