Question

我正在尝试使用图标中的onClick运行功能。当我单击图标时，出现错误

删除未在index.php中定义

我已经在下面的代码中定义了该函数，但是我不能说出为什么这个问题没有得到解决。我想实现的是

我正在将值element.id传递给function Remove(element.id)，这样我就可以检索和警告在Remove函数中传递的值。有什么帮助吗？

PS：Jquery初学者

$('#button').click(function() {
  var item_name = $('#name').val();
  var item_cost = $('#cost').val();
  $.ajax({
    url: '<?php echo base_url('shop/items'); ?>',
    data: '&item_name=' + item_name + '&item_cost=' + cost,
    type: 'POST'
  }).done(function(result) {
    var obj = $.parseJSON(result);
    $.each(obj, function(index, element) {
      $('#table').append("<tr><td>" + (index + 1) + "</td><td><i onclick='Remove(" + element.id + ");' id='icon'  class=\"icon-refresh\" title=\"click here\"></i></td></tr>");
      $('#icon').click(function() {
        function Remove(item) {
          alert(item);
        }
      });
    });

Answer 1

这里有两个问题。首先，您看到的错误是因为当您使用on*属性时，您调用的函数必须在全局范围内，但是您是在jQuery click处理程序中定义的。

第二，您要在创建的每个新id元素中重复i属性。这是无效的，因为id在DOM中必须唯一。因此，请使用常见的class按行为对元素进行分组。

最后，在处理动态创建的元素时，最好使用单个委托事件处理程序。

考虑到所有这些，请尝试以下操作：

$('#table').on('click', '.icon', function() {
  console.log($(this).data('id'));
  // implement whatever logic should run when the <i> is clicked here...
});

$('#button').click(function() {
  var item_name = $('#name').val();
  var item_cost = $('#cost').val();

  $.ajax({
    url: '<?php echo base_url('shop/items'); ?>',
    data: {
      item_name: item_name,
      item_cost: cost
    },
    type: 'POST'
  }).done(function(result) {
    var obj = $.parseJSON(result);
    $.each(obj, function(index, element) {
      $('#table').append('<tr><td>' + (index + 1) + '</td><td><i data-id="' + element.id + '" class="icon-refresh" title="click here"></i></td></tr>');
    });
  });
});

Answer 2

在jquery外部编写remove（）函数。它会为您服务。

未定义功能删除-jQuery（Ajax）

2 个答案: