Javascript 一页上有两个表-行上的按钮用于运行不同的脚本

我有一个包含2个表的页面，每行有一个“选择”按钮，单击该按钮时需要运行脚本。我已经在第一个表中使用了它，但无法解决如何在两个表中都使用它

以下是表格的HTML：

选择主要


代码
描述
挑选
BJ2345
笔记本电脑13英寸显示屏
挑选
AZ77656
笔记本电脑15英寸显示屏
挑选
选择配件


代码
描述
挑选
MM42412341
老鼠
挑选
KB42341243
键盘
挑选
USB421341234
USB适配器
挑选
PWR363456534
电源适配器
挑选

我相信这就是您想要的：

$（文档）.ready（函数（）{
$（“table:first”）。查找（'按钮[type！=“submit”]”）。单击（函数（）{
$（“表：第一”）.find（“tr”）.removeClass（“成功警告危险”）；
$（此）.parents（“tr”）.addClass（“success”）；
$（“#productID”）.val（$（this.parents（“tr”）.attr（“id”））；
});
$（“表”）.eq（1）.find（'按钮[type！=“submit”]”）。单击（函数（）{
$（“表”）.eq（1）.find（“tr”）.removeClass（“成功警告危险”）；
//你要什么颜色都行
$（此）.parents（“tr”）.addClass（“警告”）；
//没有提供此代码段，所以我只编写了accessoryID
$（“#accessoryID”）.val（$（this.parents（“tr”）.attr（“id”））；
});
});

选择主要


代码
描述
挑选
BJ2345
笔记本电脑13英寸显示屏
挑选
AZ77656
笔记本电脑15英寸显示屏
挑选
选择配件


代码
描述
挑选
MM42412341
老鼠
挑选
KB42341243
键盘
挑选
USB421341234
USB适配器
挑选
PWR363456534
电源适配器
挑选
我相信这就是您想要的：


$（文档）.ready（函数（）{
$（“table:first”）。查找（'按钮[type！=“submit”]”）。单击（函数（）{
$（“表：第一”）.find（“tr”）.removeClass（“成功警告危险”）；
$（此）.parents（“tr”）.addClass（“success”）；
$（“#productID”）.val（$（this.parents（“tr”）.attr（“id”））；
});
$（“表”）.eq（1）.find（'按钮[type！=“submit”]”）。单击（函数（）{
$（“表”）.eq（1）.find（“tr”）.removeClass（“成功警告危险”）；
//你要什么颜色都行
$（此）.parents（“tr”）.addClass（“警告”）；
//没有提供此代码段，所以我只编写了accessoryID
$（“#accessoryID”）.val（$（this.parents（“tr”）.attr（“id”））；
});
});

选择主要


代码
描述
挑选
BJ2345
笔记本电脑13英寸显示屏
挑选
AZ77656
笔记本电脑15英寸显示屏
挑选
选择配件


代码
描述
挑选
MM42412341
老鼠
挑选
KB42341243
键盘
挑选
USB421341234
USB适配器
挑选
PWR363456534
电源适配器
挑选
写答案时被打断，但您可以尝试以下方法：

const selectHelper =
  ($me,classToAdd,inputSelector) => {
    $me.parents("table")
      .eq(0)
      .find("tr")
      .removeClass("success warning danger");
    const id = 
      $me.parents("tr")
        .eq(0)
        .addClass(classToAdd)
        .attr("id")
    ;
    $(inputSelector).val(id);
  }
;
const clickActions = {
  one:(e,$me)=>
    selectHelper(
      $me
      ,"warning"
      ,"#inputidOne"
    )
  ,two:(e,$me)=>
    selectHelper(
      $me
      ,"success"
      ,"#inputidTwo"
    )
};
$(document.body)
  .on(
    "click"
    ,`[data-action-click]`
    ,e=>{
      const action = e.target.getAttribute("data-action-click");
      if(typeof clickActions[action] === "function"){
        clickActions[action](e,$(e.target))
      }
      debugger;
    }
  )

该按钮需要一个
数据操作click
属性，该属性具有单击时要执行的函数的名称：

  <button 
    type="button"
    data-action-click="two"
    class="btn btn-success btn-sm"
  >
    Select
  </button>


挑选
写答案时被打断，但您可以尝试以下方法：

const selectHelper =
  ($me,classToAdd,inputSelector) => {
    $me.parents("table")
      .eq(0)
      .find("tr")
      .removeClass("success warning danger");
    const id = 
      $me.parents("tr")
        .eq(0)
        .addClass(classToAdd)
        .attr("id")
    ;
    $(inputSelector).val(id);
  }
;
const clickActions = {
  one:(e,$me)=>
    selectHelper(
      $me
      ,"warning"
      ,"#inputidOne"
    )
  ,two:(e,$me)=>
    selectHelper(
      $me
      ,"success"
      ,"#inputidTwo"
    )
};
$(document.body)
  .on(
    "click"
    ,`[data-action-click]`
    ,e=>{
      const action = e.target.getAttribute("data-action-click");
      if(typeof clickActions[action] === "function"){
        clickActions[action](e,$(e.target))
      }
      debugger;
    }
  )

该按钮需要一个
数据操作click
属性，该属性具有单击时要执行的函数的名称：

  <button 
    type="button"
    data-action-click="two"
    class="btn btn-success btn-sm"
  >
    Select
  </button>


挑选
加载其他脚本？？？如果在两个页面上有JavaScript，为什么不使用不同的脚本标记呢？只需执行所需的代码。当使用jQuery获取单元格/表/行时，请使用.closest（），因为这样您只针对您所在的表。是否加载其他脚本？？？如果在两个页面上有JavaScript，为什么不使用不同的脚本标记呢？只需执行所需的代码。当使用jQuery获取单元格/表/行时，请使用.closest（），因为这样您只针对您所在的表。