如何在自动完成弹出窗口打开时阻止HTML部分标记滚动
在HTML中，当弹出窗口打开时，可以通过以下方法阻止部分标记滚动：
- 使用CSS属性
overflow: hidden;：将需要阻止滚动的标记的CSS属性设置为overflow: hidden;。这将隐藏任何溢出内容并禁用滚动条。 - 使用JavaScript事件处理程序：可以使用JavaScript来捕获弹出窗口的打开事件，并在此事件中阻止滚动。以下是一个示例：
// 获取弹出窗口元素
var popup = document.getElementById('popup');
// 监听弹出窗口打开事件
popup.addEventListener('click', function(event) {
// 阻止事件冒泡，防止滚动传递到父元素
event.stopPropagation();
// 阻止默认的滚动行为
event.preventDefault();
});在上述示例中，我们假设弹出窗口的元素具有id为popup。通过监听点击事件，我们可以阻止事件冒泡和默认的滚动行为，从而阻止滚动。
请注意，以上方法只是阻止了部分标记的滚动，如果需要阻止整个页面的滚动，可以将上述方法应用于<body>标记或其他包含整个页面内容的父元素。
推荐的腾讯云相关产品：腾讯云云服务器（CVM），产品介绍链接地址：https://cloud.tencent.com/product/cvm
相关·内容
1回答
$(this).hide()；无论如何都不会关闭弹出div。jQuery
jquery、html、css、popup、hide
我正在努力关闭一个弹出窗口，它显示在点击，但它不工作，因为一些原因，这是不明显的，我。
以下是HTML结构：
<div id="buttons">
<div class="content-wrapper">
<h2>Some title</h2>
<div class="red-divider"></div>
<div class="buttons">
<div
浏览 0提问于2014-09-24得票数 1
回答已采纳
3回答
event.preventDefault vs event.stopPropagation
javascript、jquery、preventdefault、stoppropagation
有人能解释一下event.preventDefault()和event.stopPropagation()之间的区别吗
我有一个表，在这个表中我有一个img标记。
当我点击img标签时，我想看到一个弹出窗口。
但是我也想停止对多行的选择，所以我使用：
$("table.items tbody tr").click(function(event) {
event.stopPropagation();
});
当我使用js代码时，弹出窗口没有出现；
如果我删除js代码，弹出窗口就会正常工作。
$(".info").live("clic
浏览 0提问于2013-08-09得票数 16
回答已采纳
1回答
onMouseUp元素样式设置正确，为什么不需要重置CSS？
javascript、css
我有一些head text/javascript：
function Show() {
document.getElementById("Popup").style["display"] = "block";
}
function Hide() {
document.getElementById("Popup").style["display"] = "none";
}
在身体里我这样做：
<a href="" onMouseDown="Show()&#
浏览 0提问于2011-04-07得票数 0
回答已采纳
2回答
当单击弹出对话框时，ReactJs down元素被选中
javascript、reactjs
我有一个表列表视图及其行编辑选项。 当单击编辑图标时，会打开一个弹出窗口，其中包含一些输入字段(下拉菜单、文本字段等)。当我在模式弹出窗口中点击输入元素时，根据点击的元素位置，下面表格中的相应行将被选中。 我们如何阻止点击/选择事件通过下面的元素？
浏览 25提问于2021-06-25得票数 0
回答已采纳
1回答
单击输入时停止传播
javascript、jquery、html、stoppropagation
我有一个html表，当用户单击一个表行时，该行的复选框就会被选中，并且会出现一些其他功能。当用户单击select或input时，我想停止传播，这样复选框就不会改变。我已经演示了我在这个JSFiddle中寻找的功能：
在我的开发站点上，当用户单击select时，复选框会更改(根据需要)，但如果用户单击输入，则复选框不会更改。我有以下代码来阻止checkbox更改：
$("select").click(function (e) {
e.stopPropagation();
});
$("input").click(function (e) {
e
浏览 0提问于2014-12-03得票数 5
1回答
将溢出隐藏添加到正文
javascript、jquery
我有一个弹出式窗口，我想添加溢出隐藏到主体，一旦弹出式窗口被显示，当它被隐藏时，我要将它改回滚动。弹出窗口是通过第三方插件插入的，我唯一可以访问的javascript文件是我的主题文件。我现在有这个
$( "div" ).click(function() {
if ($('body').css('overflow-y') == "hidden") {
$("body").css("overflow-y", "scroll");
}
});
$("#in
浏览 1提问于2016-11-04得票数 1
1回答
使用按钮打开和关闭嵌套弹出窗口
javascript、popup、nested
我正在尝试使用两个jquery函数在一个页面中显示多个弹出窗口。其中之一是打开弹出窗口的按钮(嵌套在按钮内部，以便将弹出窗口定位在按钮旁边)。另一个功能是关闭弹出窗口(位于嵌套的div中)的按钮。
问题是，组成第一个按钮的div将其功能扩展到打开的弹出窗口，有效地使它在每次我想关闭弹出窗口时再次打开。(至少我是这么认为的，因为在我取消弹出窗口中打开按钮的嵌套之后，它就开始工作了。)
下面是javascript的代码
jQuery(document).ready(function(){
$(".button_open").click(function()
{
$(this).c
浏览 1提问于2013-03-01得票数 0
回答已采纳
1回答
推翻rowOnClick t:datatable
javascript、jsf、datatable
我有一个带有rowOnClick事件触发器的t:datatable。这是可行的，但是我在列中有一个图标，当您单击该图标时，会打开一个弹出窗口。但是它也会触发rowOnClick事件。我不想那样，对于那个图标，我不希望rowOnClick事件被触发。
是否可以重写/重写datatable中某些列的rowOnClick事件。
<t:dataTable rowClasses="row1,row2" id="typelist" value="#{vehicle.vehicleTypeList}" rowOnClick="selectType
浏览 4提问于2014-06-17得票数 0
回答已采纳
1回答
在angular 7/8中弹出其他窗口时，防止背景窗口向上滚动到顶部
javascript、css、angular、angular7、angular8
所以我有一个弹出窗口，当我单击一个标签时，它会在页面中间打开，但是，当弹出窗口显示时，背景窗口总是滚动到顶部。我希望背景页不会一直向上滚动，只需停留在它所在的位置。下面是代码 HTML <div class="notSU">
<a (click)="open()">open popup window</a>
</div> javascript (ts文件) open(){
const window: WindowRef = this.windowService.open({
title:
浏览 18提问于2020-09-15得票数 0
1回答
如何在单击下拉菜单触发的弹出框时防止下拉菜单隐藏？
javascript、jquery、ajax、twitter-bootstrap
使用标准的Twitter javascript组件，下拉菜单触发了一个弹出。
当用户点击弹出框时，您能帮我防止下拉列表关闭吗？
这里有一个小提琴：
UX：
单击下拉菜单按钮===>下拉菜单显示
单击弹出下拉项目===> popover显示
单击Popover ===>下拉菜单，弹出窗口消失！O不！我怎样才能防止这种情况？
我希望弹出和下拉列表保持向上，直到(a)单击外部下拉列表和弹出，或(b)故意隐藏(例如，单击popover表单提交后)。
html：
<div class="btn-group">
<button
浏览 2提问于2013-04-21得票数 0
回答已采纳
2回答
无法在溢出时停止滚动:仅在ios设备上隐藏
ios、css
我在整个屏幕上使用弹出窗口。当弹出窗口打开时，我将正文和html CSS设置为overflow: hidden并防止屏幕滚动。在所有浏览器和安卓设备上都能正常工作，但问题出在iOS设备上。我无法停止在ios设备上滚动。
<html style="overflow: hidden;">
<body style="overflow: hidden;">
<div class="popup" style="position: fixed;">
</div>
</body>
&l
浏览 1提问于2018-07-06得票数 0
1回答
添加音频播放器，启用和禁用标签
javascript、html
在这篇博客中，我发现了一个有趣的效果，我使用footer属性进行编程实践。其效果是滑动页脚，就像我为之工作的程序的选项卡一样。
现在的问题是，如果我添加一个音频播放器以上的标签，当我想开始音频播放，标签幻灯片点击我的播放器例如点击播放或停止，我想要的是，只有这激活了页脚标签，点击它来滑动，而不是音频播放器，不执行任何行动，滑动作为一个项目，只有当我点击它播放。代码如下：
HTML
<span class="fTab">
<!- - AUDIO- - >
<section id="repro">
<au
浏览 3提问于2017-04-23得票数 1
1回答
卡头停止传播不起作用，
javascript、html、angular
我使用卡头打开卡主体，在标题中我有一个按钮(添加按钮)。问题是，当我单击(add按钮)时，卡主体被打开，预期的behevior只执行按钮代码。在我的代码下面
<div class="card recoCard">
<div class="card-header recoHeader" data-bs-toggle="collapse"
data-bs-target="#recouvrementCard" aria-expanded="false"
aria-controls="r
浏览 2提问于2022-08-17得票数 0
1回答
使用父指令和子指令等待的AngularJS适当事件
javascript、angularjs、events、angularjs-directive、event-propagation
我正在尝试实现弹出窗口和按钮来显示它。我是通过指令来做的：
<div class="wrapper" wrapper>
<div class="popup" ng-class="{'popup__active':isActive}">
Popup message
</div>
<button btn>Click me</button>
</div>
当弹出可见时，我需要通过单击弹出窗口之外的任何位置来关闭它。
var app = angul
浏览 2提问于2015-06-20得票数 1
回答已采纳
1回答
Jquery mouseover和z-index:是什么决定了哪个元素在“顶部”？
jquery、z-index、mouseover
我正在做一个需要大地图的游戏。我所做的是在一个z索引为1的可滚动div (scrollWindow)的背景中设置12k x 12k像素的大地图。
稍后，Ajax调用返回一些JSON数据，这些数据在大型背景映射中添加了许多类(City_Palace)。这些元素的z索引为9。
我还设置了几个mouseover事件，根据光标是在背景中的地图上还是在地图上绘制的城市来做不同的事情。然而，即使城市的z指数比主窗口的z指数高得多，该事件也不会为城市鼠标悬停而触发，因为可滚动窗口位于“顶部”。
当涉及到鼠标事件时，jquery使用什么标准来确定哪个div在“顶部”？看起来z-index并非如此。
下面是一些
浏览 0提问于2013-06-17得票数 1
回答已采纳
1回答
在块内单击时，会触发外部单击
reactjs
在单击内部单击时，我是否可以这样做，以使顶部单击不起作用？ ? 我有一个弹出窗口，它是在块内的点击它打开。因此，我需要实现这个逻辑来关闭它。 import React, {Component} from 'react';
class Test extends Component {
onClick() {
console.log(111)
// I need when click onClick1 this not trigger
// open popup
}
onClick1() {
console.log(222)
浏览 18提问于2019-04-12得票数 1
回答已采纳
2回答
如何处理网页和移动浏览器上的滚动？
jquery、html、css、scroll、mobile-browser
我正试图建立一个网站。客户的要求如下。
想要滚动div弹出，而背景忽略滚动
也想在手机上做这件事。
就我所知道。我可以处理通过‘溢出’关键字CSS滚动。我的策略是
当弹出显示属性在块中切换时，然后调用$('body').css('overflow', 'hidden')。
当弹出显示属性没有提交时，然后调用$('body').css('overflow', 'auto')。
这在网络浏览器中是可行的。然而，当我在移动浏览器上尝试这一点时，它的工作方式却是相反的。
我找
浏览 3提问于2015-04-21得票数 0
回答已采纳
4回答
停止javascript事件传播
javascript、jquery、events
当您将鼠标悬停在以下站点上的某个图像上时，将出现一个包含操作按钮的div。当您单击div时，弹出窗口将打开，当您单击子操作按钮时，将发生不同的事件。
当你点击div的一个子按钮时，弹出窗口就会弹出来。我尝试使用下面的代码停止事件传播。
$(document).on('click', '#DOMWindow .like', function(event) {
event.preventDefault();
event.stopPropagation();
});
浏览 0提问于2012-04-12得票数 1
回答已采纳
4回答
有没有可能有一个弹出式div‘爆发’溢出:滚动或溢出:自动容器？
html、css
我有一个包含弹出菜单的可滚动区域。从概念上讲，就像这样：
<div style="overflow:auto; width:100px; height:100px">
... content here that's big enough to trigger scrollbars...
<div>
<a href="javascript:$('#popup').show()">Click here</a>
<div style="position:rel
浏览 2提问于2010-08-24得票数 20
回答已采纳
1回答
Ipad div内容在用作弹出窗口时不能滚动
jquery、ipad
我不能解决这个问题:我有一个div，我用jquery将其显示和隐藏为弹出窗口。内容是facebook的评论插件。代码如下：
<div id="popup">
<div class="mask">
<div class="fb-comments" data-href="http://www.example.com" data-num-posts="30" data-width="470" data-colorscheme="light
浏览 2提问于2012-11-30得票数 6
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
