<p>我想要做的是，当模态框打开时，禁用整个页面的JavaScript滚动。问题是，当我打开模态框并尝试滚动时，它确实移动了模态框后面的内容，即实际的网页，我想禁用它。当模态框打开时，背景应该被冻结。</p> <pre class="brush:php;toolbar:false;">&lt;div id="fullpage"&gt; &lt;div class="section"&gt; &lt;?php include './home-page/home-page-manufacturing-list.php';?&gt; &lt;button id="turnOff" onclick="document.getElementById('id01').style.display='block'" class="w3-button w3-black"&gt;打开模态框&lt;/button&gt; &lt;/div&gt; &lt;/div&gt; &lt;div id="id01" class="w3-modal"&gt; &lt;div class="w3-modal-content"&gt; &lt;div class="w3-container"&gt; &lt;span onclick="closeModal('modal01')" class="w3-button w3-display-topright"&gt;&amp;times;&lt;/span&gt; &lt;div class="container background-filter"&gt; &lt;div class="row"&gt; &lt;div class="col-12"&gt; &lt;h3 class="section-title"&gt;&lt;/h3&gt; &lt;/div&gt; &lt;div class="col-12"&gt; &lt;h5&gt;在我们的公司，我们对木工有着激情，这在我们所有的制造和室内设计项目中都能体现出来。我们擅长制作定制木制家具、装置和装饰品，它们不仅功能强大，而且美观&lt;/h5&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;script&gt; $(document).ready(function() { var isModalOpen = false; // 当模态框打开时禁用FullPage.js滚动 function disableFullPageScroll() { $.fn.fullpage.setAllowScrolling(false); $.fn.fullpage.setKeyboardScrolling(false); } // 当模态框关闭时启用FullPage.js滚动 function enableFullPageScroll() { $.fn.fullpage.setAllowScrolling(true); $.fn.fullpage.setKeyboardScrolling(true); } // 打开模态框 function openModal(modalId) { document.getElementById(modalId).style.display = 'block'; isModalOpen = true; disableFullPageScroll(); } // 关闭模态框 function closeModal(modalId) { document.getElementById(modalId).style.display = 'none'; isModalOpen = false; enableFullPageScroll(); } // 处理按钮点击事件以打开和关闭模态框 $('#openModalButton').on('click', function() { openModal('id01'); // 将 'id01' 替换为您的模态框的ID }); $('#closeModalButton').on('click', function() { closeModal('id01'); // 将 'id01' 替换为您的模态框的ID }); // 处理滚动事件 $(window).on('scroll', function(event) { if (isModalOpen) { event.preventDefault(); event.stopPropagation(); } }); }); &lt;/script&gt;</pre>

<button id="openModalButton" class="w3-button w3-black">打开模态框</button>

<span id="closeModalButton" class="w3-button w3-display-topright">&times;</span>

window.closeModal = closeModal;

function disableFullPageScroll() {
    $.fn.fullpage.setAllowScrolling(false);
    $.fn.fullpage.setKeyboardScrolling(false);
    document.body.style.overflow = 'hidden';
}

function enableFullPageScroll() {
    $.fn.fullpage.setAllowScrolling(true);
    $.fn.fullpage.setKeyboardScrolling(true);
    document.body.style.overflow = 'auto';
}