JavaScript可以通過屏幕方向來調整顯示效果，而有些人可能并不希望其手機橫屏，那么如何禁止手機橫屏呢？本文將為大家介紹。

JavaScript可以監聽手機屏幕方向，通過調整CSS樣式來實現橫屏和豎屏的切換。那么如果我們想禁止手機橫屏呢？可以使用以下代碼：

window.addEventListener("orientationchange", function() {
if (window.orientation == 90 || window.orientation == -90) {
document.documentElement.style.webkitTransform = "none";
document.body.style.width = "100%";
document.body.style.height = "100%";
document.body.style.overflow = "hidden";
document.getElementById("landscape").style.display = "block";
} else {
document.documentElement.style.webkitTransform = "rotate(0)";
document.body.style.width = "auto";
document.body.style.height = "auto";
document.body.style.overflow = "visible";
document.getElementById("landscape").style.display = "none";
}
});

上述代碼中，我們監聽了屏幕方向變化事件，然后判斷當前屏幕方向是否為橫屏。如果是橫屏，我們就通過修改CSS樣式來將網頁旋轉至豎屏，同時隱藏橫屏時顯示的HTML元素；如果不是橫屏，我們就將網頁恢復至豎屏，同時恢復橫屏時隱藏的HTML元素。

當然，這只是一種簡單的方法，我們還可以通過CSS樣式來禁止頁面橫屏：

@media screen and (orientation: landscape) {
body {
transform: rotate(90deg);
transform-origin: center center;
width: 100%;
height: 100%;
overflow: hidden;
position: fixed;
}
}

通過上述CSS樣式，我們可以禁止頁面在橫屏模式下滾動，同時固定頁面在豎屏狀態。這種方法比較簡單，但是缺點是無法控制橫屏時出現的HTML元素。

總之，禁止手機橫屏可以通過JavaScript和CSS方式實現，具體實現方式可根據實際需求進行選擇。希望本文能夠幫助到大家。