移动端 点击新增 动态新增一行输入框 带删除按钮

可以通过以下步骤实现这个功能：

1. 在HTML中创建一个表单，并为其添加一个按钮。当用户点击该按钮时，将动态添加新的表单行。

<form>
  <div id="form-rows">
    <div class="form-row">
      <input type="text" name="input[]" placeholder="Enter some text">
      <button type="button" class="remove-row">Remove</button>
    </div>
  </div>
  <button type="button" id="add-row">Add New Row</button>
</form>

2. 在JavaScript中，为“添加新行”按钮添加一个事件监听器。当用户点击该按钮时，将调用一个函数来动态创建新的表单行并将其添加到表单中。

const formRows = document.getElementById('form-rows');
const addRowBtn = document.getElementById('add-row');

addRowBtn.addEventListener('click', function(event) {
  const newRow = document.createElement('div');
  newRow.classList.add('form-row');
  newRow.innerHTML = `
    <input type="text" name="input[]" placeholder="Enter some text">
    <button type="button" class="remove-row">Remove</button>
  `;
  formRows.appendChild(newRow);
});

3. 为新创建的表单行中的“删除”按钮添加事件监听器。当用户点击该按钮时，将从表单中删除相应的表单行。

formRows.addEventListener('click', function(event) {
  if (event.target.classList.contains('remove-row')) {
    const row = event.target.closest('.form-row');
    row.parentNode.removeChild(row);
  }
});

这样，当用户在移动设备上点击“添加新行”按钮时，将动态添加一行包含输入框和删除按钮的表单行，并且用户可以通过点击相应行的“删除”按钮来删除该行。