时间戳

首页 > 解决方案 > 从 onclick 方法将 id 传递给函数

javascript - 从 onclick 方法将 id 传递给函数

问题描述

我知道这里已经有很多此类问题，但我找不到与我的具体情况相匹配的问题。

我只想将一个 id 变量从 onclick 事件传递给一个函数，但是我的设置方式有些不对劲

目标是能够在单击 X 时删除已添加的行

 $(document).ready(function () {
    $("#subjectlist")
        .change(function () {
            console.log("hit");
            $("select option:selected").each(function () {
                console.log($("select option:selected"));
                var id = 1;
                $('#overview').append("<tr id='id'><td>" +
                    $(this).text() + "</td><td id='id' 
onclick='removeItem(id)'>" + "X" + "</td></tr>");
                id = id + 1;                    
            });
        })
        .trigger("change");

    $(".btn1").click(function () {
        $("#subjectlist").toggle();
    });
});

function removeItem(id) {
    console.log(id.val);
    console.log(id);
    $('#overview').find('tr td').eq(id).remove();
}

标签： javascriptjquery

解决方案

如果您的目标是删除单击的“td”元素。试试这个...

$(document).ready(function () {
  var id = 1;
  $("#subjectlist")
      .change(function () {
          console.log("hit");
          $("select option:selected").each(function () {
              console.log($("select option:selected"));
              //var id = 1; moved this initialization up a scope level
              //on the line below I corrected the concatenation to have unique id's, and removed inline click event.
              $('#overview').append("<tr id='id'><td>" + $(this).text() + "</td><td id="+id+">" + "X" + "</td></tr>");
              id = id + 1;                    
          });
      })
      .trigger("change");

  $(".btn1").click(function () {
      $("#subjectlist").toggle();
  });
  // added click event to your dynamic element
  $("#overview").on('click','td', function() {
    $(this).parent().remove();
  });
});

/* removed
function removeItem(id) {
  console.log(id.val);
  console.log(id);
  $('#overview').find('tr td').eq(id).remove();
}*/

推荐阅读