내 웹 사이트 랜딩 페이지의 날씨 섹션을 숨기는 버튼을 만들고 싶었지만 만드는 방법을 모르겠습니다!
저는 현재 "선택기"를 사용하므로 오른쪽 하단에서 볼 수있는 0
또는 1
오른쪽 하단에서 볼 수있는 것을 선택할 수 있습니다. 잘 작동하지만 버튼을 권장합니다. 내가 사용하는 현재 코드는 다음과 같습니다.
</div>
<div class="wopacity">
<select onchange="myFunction(this);" size="2">
<option>0
<option selected="selected">1
</select>
<script>
function myFunction(x) {
// Return the text of the selected option
var opacity = x.options[x.selectedIndex].text;
var el = document.getElementById("p1");
if (el.style.opacity !== undefined) {
el.style.opacity = opacity;
} else {
alert("Your browser doesn't support this example!");
}
}
</script>
</div>
버튼을 사용하려면 버튼에 data- * 속성 을 추가 할 수 있습니다 . 다음과 같이 보일 것입니다.
<html>
<head>
<script>
function myFunction(button) {
// get data-opacity
let opacity = button.dataset.opacity;
const el = document.getElementById("p1");
el.style.opacity = opacity;
/* shorthand for
if (opacity === "1") {
button.dataset.opacity === "0";
else {
button.dataset.opacity === "1";
}
*/
button.dataset.opacity = opacity === "1" ? "0" : "1";
}
</script>
</head>
<body>
<div id="p1">Opacity test</div>
<button data-opacity="0" onclick="myFunction(this)">Change opacity</button>
</body>
</html>
이것이 실제로 당신이 원하는 것입니까, 아니면 제가 잘못된 질문을 받았습니까?
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다