為每個tr元素創建下拉選單


// 為每個tr元素創建下拉選單和編輯按鈕
for (var i = 0; i < rows.length; i++) {
  var row = rows[i];

  // 創建下拉選單元素
  var dropdown = document.createElement("select");

  // 創建複製選項
  var cloneOption = document.createElement("option");
  cloneOption.text = "複製";
  cloneOption.value = "clone";
  dropdown.add(cloneOption);

  // 創建刪除選項
  var deleteOption = document.createElement("option");
  deleteOption.text = "刪除";
  deleteOption.value = "delete";
  dropdown.add(deleteOption);

  // 創建編輯按鈕
  var editButton = document.createElement("button");
  editButton.textContent = "編輯";
  editButton.onclick = function() {
    var target = this.getAttribute("data-target");
    window.location.href = target;
  };

  // 將下拉選單和編輯按鈕添加到tr元素的第一個單元格中
  var firstCell = row.cells[0];
  firstCell.insertBefore(dropdown, firstCell.firstChild);
  firstCell.appendChild(editButton);

  // 設定編輯按鈕的data-target屬性為指定的URL
  var target = "http://example.com/edit/" + i;
  editButton.setAttribute("data-target", target);

  // 當選擇一個選項時,執行相應的操作
  dropdown.onchange = function() {
    var selectedOption = this.options[this.selectedIndex];
    var selectedValue = selectedOption.value;

    if (selectedValue == "clone") {
      // 複製當前的tr元素
      var clonedRow = this.parentNode.parentNode.cloneNode(true);
      this.parentNode.parentNode.parentNode.insertBefore(clonedRow, this.parentNode.parentNode.nextSibling);
    } else if (selectedValue == "delete") {
      // 刪除當前的tr元素
      this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode);
    }
  };
}

この記事が気に入ったらサポートをしてみませんか?