我在这里有一个js音量调节功能。保存音量滑块的音量设置
经由HTML后显示为这样
<html><input type="range" onchange="setVolume()" id='volume1' min=0 max=1 step=0.01 value=1></html>
我想滑块每次保存体积,优选到会话或东西,所以每次用户刷新页面中,音频滑块不会自动重置为'1'(范围为0到1)。
这可能可以做到吗? 谢谢:)
我在这里有一个js音量调节功能。保存音量滑块的音量设置
经由HTML后显示为这样
<html><input type="range" onchange="setVolume()" id='volume1' min=0 max=1 step=0.01 value=1></html>
我想滑块每次保存体积,优选到会话或东西,所以每次用户刷新页面中,音频滑块不会自动重置为'1'(范围为0到1)。
这可能可以做到吗? 谢谢:)
更新: 使用这个作为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';
}
?>
玩得开心!
嘿那里感谢您的反馈...但是我尝试了你的建议,它似乎并没有工作。 –
可以使用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>
当然可以。尝试使用localStorage – Beginner