困惑？标题。是的，我知道，但现在知道如何更好地描述它了。
我有以下内容：-9个目标-每个目标有3个包-每个包有1个与此问题无关的packageinfo//。
// Relations
- Objective->hasMany('Package');
- Package->belongsToMany('Objective');
在我网站的一个页面上，我展示了所有（9）个目标。当用户点击目标时，我希望相关的包显示出来。但我真的不清楚如何做到这一点（客户端）。。
我试过了：
@foreach($objectives as $objective)
<div class="col-4">
<span class="{{$objective->icon}}"></span>
{{$objective->naam}}
</div>
@foreach($objective->packages() as $package)
<div style="">
{{$package->title}}
{{$package->information}}
{{$package->link}}
</div>
@endforeach
@endforeach
这既没有显示相关的包，也没有给我一个错误。除此之外。我所做的是正确的吗？
我也试着用jquery获取包，但没有成功。。我的问题。。。我怎样才能最好地做到以上几点？（包应该隐藏，直到用户点击目标，没有任何页面更改或任何东西）
-----------------编辑
请忽略上面的代码。
我有以下代码：
<script>
$(document).ready(function(){
$('.objective').on('click',function(){
var objective = $(this).data('titel');
document.getElementById('objective').value = $(this).data('title');
// this doesnt work i know, but its here to explain the stuff beneath this.
$id = document.getElementById('objective').value;
// code which gets the id of hidden input and finds all packages related to this objective id.
// i.e. Package::with('objectives')->where('id','=', $id)->get();
// save it as $packages. Which will fill the second foreach
});
});
</script>
<div class="col-12">
<input type="hidden" name="objective" id="objective" />
@foreach($objectives as $objective)
<div class="col-4 objective" data-title="{{$objective->id}}">
<span class="{{$objective->icon}}"></span>
{{$objective->name}}
</div>
@endforeach
</div>
// the two have to be seperate from eachother in order to succesfully show related packages.
<div class="col-12">
@foreach($packages as $package)
<div>
{{$package->title}}
<?php $information = explode(',',$package->information); ?>
@foreach($information as $info)
{{$info}}<br />
@endforeach
{{$package->link}}
</div>
@endforeach
</div>
有很多方法可以做到这一点。您可以创建一个自发布的PHP页面，或者在单击具有onClick HTML属性的元素时使用JavaScript修改innerHTML或outerHTML。
对于PHP/Laravel方面，更改@foreach语句以删除packages:之后的()
@foreach($objective->packages as $package)
（这假设您的hasMany关系称为packages…仔细检查目标模型中的情况。）
因此，您的控制器将收集所有目标及其相关包：
$objectives = Objective::with('packages')->get();
并将整个CCD_ 9结果传递给视图。现在，在视图中，您已经拥有了所有的Objectives和Packages，不需要使用javascript或ID匹配来动态检索它们。
对于响应点击方面，正如其他人所说，您需要使用javascript切换显示/隐藏，作为对onClick的响应。
如果您希望您的包裹列表与您的目标显示位置分开，即：
---
Package 1
Package 2
Package 3
...
---
Objectives (of the chosen package above)
---
然后只需在布局中分离循环，并根据所选包的id显示/隐藏适当的<div>（可以将其存储在data属性中，而不是隐藏的输入字段中）。
<div id="objectives">
@foreach($objectives as $objective)
<div class="objective" data-objective-id="{{$objective->id}}">
{{$objective->naam}}
</div>
@endforeach
</div>
<div id="packages">
@foreach($objectives as $objective)
<div id="{{$objective->id}}" class="hide">
@foreach($packages as $package)
<div>
{{$package->title}}
</div>
@endforeach
</div>
@endforeach
</div>
那么，您的jQuery将通过使用.data( "objectiveId" )读取单击的<div>的objectiveId数据值（或者您可以将id存储在Package链接的<a>标签中），然后使用下面的id为<objectiveId>的相应Package <div>读取show来响应Objective上的单击。您的Packagediv已经预先填充了数据，因此在单击Objective时无需继续进行数据库调用来检索数据。