保存音量滑塊的音量設置

經由HTML後顯示爲這樣

<html><input type="range" onchange="setVolume()" id='volume1' min=0 max=1 step=0.01 value=1></html>

我想滑塊每次保存體積，優選到會話或東西，所以每次用戶刷新頁面中，音頻滑塊不會自動重置爲'1'（範圍爲0到1）。

這可能可以做到嗎？謝謝:)

來源

2016-09-25 Gin.A

當然可以。嘗試使用localStorage – Beginner

更新：使用這個作爲index.php，update.php沒有改變。此代碼適用於我。

<?php 
    session_start(); 
?> 
<!DOCTYPE html> 
<html> 
    <head> 
     <meta charset="utf-8"> 
     <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
     <title></title> 
     <link rel="stylesheet" href=""> 
    </head> 
    <body> 
     <?php 
      if(!$_SESSION['volume']) { 
       $_SESSION['volume'] =0.5; 
      } 
      print_r($_SESSION); 

     ?> 
     <input type="range" onchange="setVolume()" id='volume1' min=0 max=1 step=0.01 value=<?php echo $_SESSION['volume']?>> 
     <script 
      src="https://code.jquery.com/jquery-2.2.4.min.js" 
      integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" 
      crossorigin="anonymous"> 
      </script> 

     <script> 
      function setVolume() { 
       mediaClip = document.getElementById("volume1").value; 
       var update= 'volume=' + mediaClip; 
       $.ajax({ 
        type: "POST", 
        url: "update.php", 
        data: update, 
        dataType: 'json', 
        cache: false, 
        success: function(response) { 
         alert(response.message); 
        } 
       }); 
      } 
     </script> 
    </body> 
</html>

Update.php

<?php 
    session_start(); 
    if($_POST['volume']) { 
     $_SESSION['volume'] =$_POST['volume']; 
     echo 'Success'; 
    } 
?>

玩得開心！

來源

2016-09-25 10:24:31

嘿那裏感謝您的反饋...但是我嘗試了你的建議，它似乎並沒有工作。 –

可以使用localStorage的，這是相同的會話，但是這是節省雖然JavaScript的

<script> 
window.onload = function() { 
    // when page is loaded restore your volume to it's save value 
    if (localStorage.getItem('volume') != null) { 
     var mediaClip = document.getElementById("background_audio") 
     mediaClip.volume = parseInt(localStorage.getItem('volume')); // you restore your volume setting to your save volume 
    } 
} 
function setVolume() { 
    var mediaClip = document.getElementById("background_audio"); 
    mediaClip.volume = document.getElementById("volume1").value; 
    localStorage.setItem('volume', mediaClip.volume); // you change your volume setting 
} 
</script>

來源

2016-09-26 07:10:41 Beginner

保存音量滑塊的音量設置

回答

相關問題