我通過使用ajax進行實時搜索，并為我的卡片組件進行了其他jquery定制（Tilt.js等）。 我成功地得到了搜索結果，但它并沒有完整的js定制功能。
Ajax
$(document).ready(function(>/span>) {
$('#location , #sector').on('change',function() {
var location = $('#location').val() 。
var sector = $（'#sector'）.val（）。
$.ajax（{
url:'search',
type:'get'。
data:{
'location':位置。
'部門':部門。
},
success:function(data){
$('#content').html（資料）。
}
})
}) });
從控制器回傳的組件
$output ='';
foreach($data as $post){
$output .=''
< div class="card mb-4" id="card" data- 傾斜 data-tilt-max="5" data-tilt-glare data-tilt-max-glare="0。 2">
<div class="card-body"/span>>
< div class="card my-2 rounded shadow item" role="button" id="' 。 $post->id。'" >
<div class=" row no-gutters">
<div class="col-sm-2 pt-3 pl-2"/span>>
<img src="'.$post-> image. '" class="img-fluid resim" alt="...">
</div>/span>
<div class="col-sm-10">
<div class="card-body"/span>>
<h4 style="font-weight: bolder;">' 。$post->公司名稱。'</h4>
<h5 class="card-title"/span> style="font-weight: bold;">'。$post->job_title.'</h5>
<p class="card-text">/span>'。$post->描述。'.</p>
<div class="row">/span>
<div class="col-sm">/span>< div class="rounded-pill text-white text-center py-2 sector" style="background-color: #003777;"> '.$post->sector.'</div></div>
<div class="col-sm">/span>< div class="rounded-pill text-white text-center py-2 location" style="background-color: #003777;"> '.$post->location.'</div> </div>
<div class="col-sm">/span>< div class="rounded-pill text-white text-center py-2" style="background-color: #003777;">現在就申請！</div></div>
</div>/span>
</div>/span>
</div>/span>
</div>/span>
</div>/span>
</div>/span>
</div>/span>
';
}
uj5u.com熱心網友回復：
這是因為javascript只在檔案加載完畢后才加載，然后它掃描你所有的dom元素并添加監聽器，如果你在這之后才加載dom元素，它們就不會有事件監聽器。要解決這個問題，有幾種方法，但最簡單的一種是
。$(document).ready(function(){
$('body').on('click',' 。 js-card',function（）{
//這個主體點擊功能只有在元素具有js-card類時才會觸發。.
});
});
另一種方法是將onclick添加到你正在加載的元素中 <button onClick="yourGlobalFunction">
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/306725.html
標籤：