Question

我希望每次循环更改时都使用下面的代码获取值，但我收到错误＆＃34;未定义＆＃34;。

 @foreach($items as $item)
    <li class="list-group-item ourItem" data-toggle="modal" data-target="#myModal">{{$item->item}}</li>
    <input type="hidden" id="itemId"  value="{{$item->id}}"/>
 @endforeach

$(document).on("click", ".ourItem", function(event) {
  var text = $(this).text();
  var id = $(this).find('#itemId').val();
  $('#addItem').val(text);
  $('#modelTile').text("Edit Item");
  $('#delete').show('400');
  $('#saveChange').show('400');
  $('#addItemBtn').hide("400");
  $('#id').val(id);
  console.log(id);
});

Answer 1

您正在收到＆＃34;错误＆＃34; id为undefined，因为jQuery＆＃39; find()无法找到该元素。

这是因为根据AtheistP3ace的评论

find()只能找到后代。 itemId不是ourItem的子项。

说......

首先，让<input>节点成为<li>元素的子节点。

@foreach($items as $item)
    <li class="list-group-item ourItem" data-toggle="modal" data-target="#myModal">{{$item->item}}
        <input type="hidden" class="item-value"  value="{{$item->id}}"/>
    </li>
@endforeach

然后您不能拥有许多具有相同HTML ID 的节点，而只是向<input>个节点提供一个类，目的是在单击父元素时找到它们。

在上面的代码段中，该类为item-value，而 ID 已删除。

最后，JavaScript部分用

修复

var id = $(this).find('.item-value').val();

整个JS成为：

$(document).on("click", ".ourItem", function(event) {
  var text = $(this).text();
  var id = $(this).find('.item-value').val(); // <--- fixed here
  $('#addItem').val(text);
  $('#modelTile').text("Edit Item");
  $('#delete').show('400');
  $('#saveChange').show('400');
  $('#addItemBtn').hide("400");
  $('#id').val(id);
  console.log(id);
});

Answer 2

更改

var id = $(this).find('#itemId').val();

代表

var id = $('#itemId').val();

Answer 3

如果我理解正确的一般逻辑，这应该有效。试试这个

var id = $(this).next('input').val();

而不是这个

var id = $(this).find('#itemId').val();

使用jQuery find（）方法时出现未定义的错误

3 个答案: