我在Laravel Blade中有一個表單，其中包含的資料需要動態地隱藏和顯示。 下面是代碼。
@foreach ($working_orders as $key => $order)
<div class="col-lg-12 row" >
<div class="title-md"/span>> 作業訂單# {{$order->id}}</div>
<div class="form-group col-lg-6"/span>>
<label style="color: #44484d;">Camión</label>
< select class="form-control kt-selectpicker truck_type" required name="truck_type" onchange="getOrderFields()">
<option value="1"/span> selected> 沒有asignar</option>。
<option value="2"/span>> Asignar empresa de logística</option>。
</select>/span>
</div>>
</div>
<div class="form-group col-lg-6 assigner_div"/span>>
<label style="color: #44484d;">Assigner</label>
<div class="input-group"/span>>
< select class="form-control kt- selectpicker" required name="carry_assigner">
<option selected="" disabled> ?</option>
@foreach ($truck_assigners as $truck_assigner)
<option> {{ $truck_assigner-> staffs-> name }}</option>
@endforeach
</select> @endforach
</div>/span>
</div>/span>
</div>
@endforeach
和jQuery
function getOrderFields（)
{
if ($(".truck_type :selected").val() == '2)
{
$('.assigner_div').show() 。
}
if ($(".truck_type :selected").val() == '1)
{
$('.assigner_div').hide()。
}
這段代碼可以隱藏和顯示欄位，但問題是我使用了類，所以foreach回圈中的所有元素都有相同的類，它可以隱藏/顯示所有的欄位。 比如說。 我在給定的foreach回圈的陣列中有兩個鍵。所以我改變了回圈中0號鍵的欄位，它隱藏了兩個鍵中的div，也就是第二個鍵。 我需要隱藏/顯示所選訂單的欄位，而不是全部。 這個問題的解決方法是什么？
uj5u.com熱心網友回復：
你可以在foreach回圈中使用$key來完成指定的任務。將$key傳遞給getOrderFields函式，并根據$key改變類名。以下是根據你的問題修改的代碼段。
...
<select class="form-control kt-selectpicker truck_type" required name="truck_type" onchange="getOrderFields({{ $key })">
...
<div class="form-group col-lg-6 assigner_div_{{ $key }}">
...
在腳本中，
function getOrderFields（key） {
if ($(".truck_type :selected").val() == '2) {
$('.assigner_div_' key).show() 。
}
if ($(".truck_type :selected").val() == '1) {
$('.assigner_div_' key).hide()。
}
uj5u.com熱心網友回復：
我會考慮改變事件處理程式，使用jQuery而不是使用onchange屬性來設定。然后你可以將DOM遍歷方法與$(this)選擇器結合起來，以實作你所尋找的目標。粗略的例子：
$(document)。 on('change', 'select.truck_type', function() {
var val = $(this).val() 。
assigner = $(this).parents(' 。 row'）.children（'.assigner_div'）。
assigner.toggle(val =='2')。
});
在這個例子中，我們使用了父母，和子女方法。雖然有許多不同的方法可以使用。例如，next方法：
$(document) 。 on('change', 'select.truck_type', function() {
var val = $(this).val() 。
assigner = $(this).parents(' .title-md').next()。
assigner.toggle(val =='2')。
});
$(document) 。 on('change', 'select.truck_type', function() {
var val = $(this).val() 。
assigner = $(this).closest(' . row'）.find（'.assigner_div'）。
assigner.toggle(val =='2')。
});
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/306717.html
標籤：
上一篇：jQuery自動完成 ajaxAPI呼叫只在空格鍵/下箭頭鍵時觸發串列？
下一篇：用遞回法尋找向量中的最大值C