設置使用ajax構建的下拉輸出的初始值

Question

我有以下下拉列表，它在選擇選項更改時用ajax更改<div id="item"></div>的輸出。 我沒有使用select2。

<?php 
    $biqsQuery = "SELECT biq.biqid, biq.name FROM biq"; 
    $biqs = $db->query($biqsQuery); 
    ?> 

      <select name="itemselector" id="itemselect"> 
       <?php foreach ($biqs ->fetchAll() as $biq): ?> 
        <option value="<?php echo $biq['biqid']);?>"> 
        <?php echo e($biq['name']);?> 
        </option> 
       <?php endforeach; ?> 
      </select> 

      <div id="item"></div> 

PHP文件：

if(isset($_GET['itemselector'])){ 



$biqQuery = "SELECT biq.biqid, biq.name, biq.img      
      FROM biq 
      WHERE biq.biqid= :biqid  "; 

$biq= $db ->prepare($biqQuery); 

$biq->execute(['biqid' => $_GET['itemselector']]); 

$selectedBiq=$biq->fetch(PDO::FETCH_ASSOC); 

echo '<img src="'. $selectedBiq['img']. '">'; 
} 

JavaScript文件：

$('#itemselect').on('change',function(){ 
var self = $(this); 

$.ajax({ 
    url: '../helpers/biq.php', 
    type: 'GET', 
    data: {itemselector : self.val()}, 
    success: function(data){ 

     $('#item').html(data); 
    } 
    }); 
}); 

它目前成功地改變輸出，對部分沒有問題。

但是當第一次加載頁面時，它會在下拉菜單中顯示錶格的第一個值，但是它不會將第一個值的圖像輸出到<div>。

我需要的是;當頁面加載時，我需要將數據庫中的第一個條目自動輸出到<div id="item"></div>。

任何幫助表示讚賞，在此先感謝。

Answer 1

你可以寫在身體負荷事件來完成這一點。請糾正，如果任何類型的失誤都會有，但是這將幫助你得到它擺脫

$(document).ready(function(){ 
 
    var first = $("#itemselect option:first").val(); 
 
    $.ajax({ 
 
    url: '../helpers/biq.php', 
 
    type: 'GET', 
 
    data: {itemselector : first}, 
 
    success: function(data){ 
 
     $('#item').html(data); 
 
    } 
 
    }); 
 
});