使用jQuery查找（）方法时未定义的错误

每次当它由循环更改时，我都想使用下面的代码获取值，但是出现“未定义”错误。使用jQuery查找（）方法时未定义的错误

@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); 
});

来源

2017-06-12 Sharifur Robin

仅查找发现后裔。 itemId不是ourItem的子项。 – AtheistP3ace

首先，您正在重复使用'itemId'作为多个输入元素。 ID在文档中必须是唯一的。另外，还不清楚其他元素在哪里，比如'＃addItem'和'＃modelTile'。你的标记在哪里？ p/s：始终发布您的标记的**呈现**版本。 – Terry

–

-1

如果我理解正确的话一般的逻辑，这应该工作。试试这个

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

取而代之的是

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

来源

2017-06-12 20:13:33 arnuga3

感谢。它工作 –

很高兴帮助find（）适用于子元素，所以你可以在你的情况下使用next（）或者兄弟（）（） – arnuga3

尽管这个解决方案有效，但我建议提及标记（HTML）应该被修复以便避免让多个节点具有相同的'itemId' ** id **（也许这个解决方案不再需要） – Paolo

-1

变化

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

为

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

来源

2017-06-12 20:06:59

不起作用请在这里检查代码 http://imgur.com/a/uU25h –

你得到的 “错误” 是id是undefined因为jQuery的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); 
});

来源

2017-06-12 20:25:38 Paolo

使用jQuery查找（）方法时未定义的错误

ADD ITEM

回答

相关问题