我的 html 頁面上有一個滑塊，我需要在同一頁面中的 php 變數上傳遞輸入變數（我的意思是滑塊的百分比，所以是 id）。我嘗試了很多方法，但沒有一種方法奏效。
我在下面附上我的代碼。我不在這里寫樣式標簽：如果需要，請向我索取。
<!DOCTYPE html>
<html>
<body>
<div class="container">
<input type="range" id="my-slider" min="0" max="100" value="50" oninput="slider()">
<div id="slider-value">0</div>
</div>
<script type="text/javascript">
const mySlider = document.getElementById("my-slider");
const sliderValue = document.getElementById("slider-value");
function slider(){
valPercent = (mySlider.value / mySlider.max)*100;
mySlider.style.background = `linear-gradient(to right, #3264fe ${valPercent}%, #9c9c9c ${valPercent}%)`;
sliderValue.textContent = mySlider.value;
}
slider();
</script>
</body>
</html>
uj5u.com熱心網友回復：
其他方法是使用 HTTP GET 或 POST 請求
<!DOCTYPE html>
<html>
<body>
<form action="get.php" method="POST">
<div class="container">
<input type="range" id="my-slider" name="svalue" min="0" max="100" value="50" oninput="slider()">
<div id="slider-value">0</div>
</div>
<input type="submit" value="Submit"></form>
<script type="text/javascript">
const mySlider = document.getElementById("my-slider");
const sliderValue = document.getElementById("slider-value");
function slider(){
valPercent = (mySlider.value / mySlider.max)*100;
mySlider.style.background = `linear-gradient(to right, #3264fe ${valPercent}%, #9c9c9c ${valPercent}%)`;
sliderValue.textContent = mySlider.value;
//document.cookie=`sliderValue=${sliderValue.innerText}; expires=Never; path=\\`;
}
slider();
</script>
</body>
</html>
獲取.php 檔案
<?php
$myvar=$_POST["svalue"];
echo "Slide value is: " . $myvar;
?>
uj5u.com熱心網友回復：
一種方法是設定 cookie 并在更改幻燈片值后在 PHP 中獲取它重新加載它，您將看到 PHP 回顯結果
<!DOCTYPE html>
<html>
<body>
<div class="container">
<input type="range" id="my-slider" min="0" max="100" value="50" oninput="slider()">
<div id="slider-value">0</div>
</div>
<script type="text/javascript">
const mySlider = document.getElementById("my-slider");
const sliderValue = document.getElementById("slider-value");
function slider(){
valPercent = (mySlider.value / mySlider.max)*100;
mySlider.style.background = `linear-gradient(to right, #3264fe ${valPercent}%, #9c9c9c ${valPercent}%)`;
sliderValue.textContent = mySlider.value;
document.cookie=`sliderValue=${sliderValue.innerText}; expires=Never; path=\\`;
}
slider();
</script>
<?php
$svalue=$_COOKIE["sliderValue"];
echo $svalue;
?>
</body>
</html>
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/487527.html
標籤：javascript php html 滑块
上一篇：無效的陣列長度分配失敗