Question

首先我得到了这个PHP代码

<?php
$sqlget2 = "SELECT * FROM  `table` ORDER BY  `table`.`id` ASC ";
$sqldata2 = mysqli_query($mysqli, $sqlget2) or die('error getting data');

    while($row = mysqli_fetch_array($sqldata2, MYSQLI_ASSOC)) {
    echo '<option value="'.$row['id'].'">Episode '.$row['id'].'</option>';
}?>

在我的数据库表中我有3行（id，stream_link，download_link）

我的目标是获取该ID的流和下载链接，该链接现在在下拉列表中选中。

我希望下载链接进入：a href =＆＃34; download_link＆＃34;

并且流链接到视频标记

<video class="afterglow" id="myvideo" width="720" height="400" data-autoresize="fit">
    <source src="" type="video/mp4">
</video>

感谢您的帮助

Answer 1

您已经提到过您拥有数据库中的值。而且你已经在做了一个SELECT *，所以当你已经从第一次获取中获得这些数据时，回到数据库，根据ID再次获取是没有意义的。所以不妨使用它，并使用HTML5数据属性。然后使用Jquery来完成剩下的工作。

WORKING EXAMPLE HERE

因此，使用数据属性将链接/流直接回显到选项元素。像这样...随便给你打电话。在这种情况下，我使用了数据链接和数据流。

<?php
 $sqlget2 = "SELECT * FROM  `table` ORDER BY  `table`.`id` ASC ";
 $sqldata2 = mysqli_query($mysqli, $sqlget2) or die('error getting data');

while($row = mysqli_fetch_array($sqldata2, MYSQLI_ASSOC)) {
 echo '<option value="'.$row['id'].'" data-link="'.$row['download_link'].'" 
 data-stream="'.$row['stream_link'].'" >Episode '.$row['id'].'</option>';
}?>

然后我会用Jquery来完成剩下的工作。

 $(document).ready(function(){

   // On select list change.     
   $('select').change(function(){

       // Find selected option element
       var opt = $(this).find(":selected");

       // Alter the download link href,  with the data-link attribute, on the option
       $('.download_link').attr('href',opt.data('link'));

       // Replace stream DIV, with data-stream attribute on the option
       $('#stream').html('<video controls autoplay class="afterglow" id="myvideo" width="720" 
          height="400" data-autoresize="fit"><source src="'+opt.data('stream')+'" type="video/mp4"></video>');

   });
});

然后在你的HTML上只有select下有两个元素。数据可以替换为

的地方

   <a href='' class='download_link'>Download</a>

   <div id="stream"></div>

Answer 2

首先改变这个：

echo '<option id="selectedOption" value="'.$row['id'].'">Episode '.$row['id'].'</option>';

然后添加一个AJAX请求（我正在使用jQuery）：

$('#select-div').on('change','#selectedOption',function() {
  let data = ('#selectedOption').val(),
  $.ajax({
    type: 'POST',
    url: 'your/route.php',
    data: data,
    success: function (result) {
      //do something
    },
    error: function (result) {
      //do something 
    }
  });
});

从动态下拉列表

2 个答案: