如何在javascript中单击按钮时删除完整的行？ [英] How to delete a complete row on button click in javascript?

问题描述

我有一个 html / php代码，如下所示。以下 html / php 代码的工作方式如下：添加行时，我们可以从每行中选择日期，也可以保存日期。

需要完成两件事。

1. 点击 Delete 按钮时，应从 JSON中删除值数组，因为保存表单后所有内容均从 JSON 中提取。




2. 此外，在单击 Delete 按钮时，它应从DOM中删除整行。

解决方案

如果前端知道您的json（我认为您是在暗示，因为您的 rowDelete 是JS函数），因此您可以将 this 传递给 rowDelete 。然后，您可以遍历DOM以获得相应的同级输入字段的值（也许像 this.parentNode.childNodes [1] 之类）。

一旦有了该值，就可以轻松地将其从json的相应数组中删除：

  let d ='2020-01-30'
让idx = arr.indexOf（d）
让newdates =（[... arr.slice（0，idx ），... arr.slice（idx + 1）]）
 data.house_sitting_date =新日期
  

（当然，还要进行一些其他的索引范围检查。）

之后，您可以执行类似的DOM遍历，以从DOM中删除相应的元素。 / p>

I have a html/php code as shown below. The below html/php code is working in a way that on adding rows, we can select date from every row and can save it as well.

Two things need to be done.

1. On clicking Delete button, it should remove the value from the JSON array because everything is pulled from the JSON after saving the form.

2. Also, on clicking Delete button it should delete the complete row from the DOM.

解决方案

If your json is known at the front-end (which I think you are implying, since your rowDelete is a JS-function), you can pass this with the call to rowDelete. Then you can traverse the DOM to get to value the corresponding sibling input-field (perhaps something like this.parentNode.childNodes[1]).

Once you have that value, you can easily remove it from the corrsponding array in your json:

let d = '2020-01-30'
let idx = arr.indexOf(d)   
let newdates = ([...arr.slice(0,idx), ...arr.slice(idx+1)])
data.house_sitting_date = newdates

(with some additional index bounds checking, of course).

After that, you can perform a similar DOM traversal to remove the corresponding element from the DOM.

这篇关于如何在javascript中单击按钮时删除完整的行？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！