使用html下拉列表中所选选项的值作为img标记的src的一部分 - Use the value of a selected option of an html dropdown list as part of a src of img tag

Use the value of a selected option of an html dropdown list as part of a src of img tag

我是一个新手在web编程，并希望使用的文本显示在html选择的选择选项作为图像标签的来源的一部分。下面是我的尝试。我该怎么做呢?

<select  id="appTutor" name="TutorSelected" >
    <option value="">Click To Select</option>
    <?php  
    $serverName = "EAZYCAL-PC'EAZYCAL";
    $connectionInfo = array( "Database"=>"e-APPRAISAL", "UID"=>"sa", "PWD"=>"love");
    $conn = sqlsrv_connect( $serverName, $connectionInfo);
    $sql="SELECT TutorID,Surname,Othernames,Department,TutorPic FROM TutorsInfo";
    $stmt = sqlsrv_query($conn, $sql);
    $row=sqlsrv_fetch_array($stmt);
    while($row=sqlsrv_fetch_array($stmt))
    { 
        ?>
        <option value="<?php echo $row['TutorID'];?>"><?php echo $row['Surname'].' '.$row['Othernames'];?>
        </option>
        <?php
    }
    sqlsrv_close($conn);
    ?>
</select>
<img id="showIMG" src="uploads/"<?php $_POST['TutorSelected']?>".jpg"/>

如上所述，您需要使用JS。下面这几行应该可以做到:

var select = document.getElementById("appTutor");
select.addEventListener('change',function(){
  var selected = select.options[select.selectedIndex].value;
  document.getElementById("showIMG").src="uploads/" + selected + "";
});