我有一些jQuery切换H3链接后的段落.它适用于PC上的IE和Chrome以及Mac上的Safari和Chrome.在两个平台上的Firefox上,单击链接什么都不做?
<script type="text/javascript">
$(document).ready(function(){
$("#rightcolumn .article .collapse").hide();
$("#rightcolumn h3 a").click(function(){
if(event.preventDefault){
event.preventDefault();
}else{
event.returnValue = false;
};
$(this).parent().next().toggle(400);
});
});
</script>
Run Code Online (Sandbox Code Playgroud)
如果我禁用event.preventDefault(); 它在Firefox中有效,但当然我将页面跳到顶部,我不想要.我该怎么做才能让它在Firefox中运行?
我的问题类似于这个,但没有一个答案解决了我的问题: 使用JQuery preventDefault(),但仍然添加URL的路径
当用户单击片段链接时,我需要删除跳转到片段的默认行为,但仍然将片段添加到URL.此代码(取自链接)将触发动画,然后将片段添加到URL.然而,片段然后导航到,我的情况下我的网站.
$("#login_link").click(function (e) {
e.preventDefault();
$("#login").animate({ 'margin-top': 0 }, 600, 'linear', function(){ window.location.hash = $(this).attr('href'); });
});
Run Code Online (Sandbox Code Playgroud) 解:
找到了解决方案.
使用的parentNode:
$('.skaftetopmenu-li > a').click(function(e) {
e.preventDefault();
var subid = $(this.parentNode).attr('id');
if (subid !="forsidemenu"){
var str = $('#submenu-content-'+subid).html();
if ($.trim(str) == ""){
$('.submenu-content', this.parentNode).load('http://' + skafte.base_url + '/inc/top-menu-subs/'+subid+'_submenu.html');
}
}
});
Run Code Online (Sandbox Code Playgroud)
我有这样一个菜单:
<ul>
<li class="parent">
<a href="url">Link title parent</a>
<ul>
<li><a href="url">Link title child</a></li>
</ul>
</li>
</ul>
Run Code Online (Sandbox Code Playgroud)
我在jQuery中尝试了以下内容:
$('.parent').click(function(e) {
e.preventDefault();
});
Run Code Online (Sandbox Code Playgroud)
但是,这会禁用整个菜单结构中的所有元素.我想只禁用父链接."ul li"中的那些,而不是"ul ul li"中的链接,但我无法弄清楚我是如何搜索和搜索的.所以请帮帮我!
编辑:谢谢你的答案.我以为我会在问题中简化我的代码,但实际上并没有让我受益.所以继承我正在使用的实际代码:
$('.skaftetopmenu-li').click(function(e) {
var subid = $(this).attr('id');
if (subid !="forsidemenu"){
var str = $('#submenu-content-'+subid).html();
if ($.trim(str) == ""){
$('.submenu-content', this).load('http://' + skafte.base_url + …Run Code Online (Sandbox Code Playgroud) 我有一组简单的复选框,可以检查多个选项,但我希望它表现得像一个单选按钮,总是有一个选项被选中。
正如您在我的代码中看到的那样,复选框将被选中,而不是取消选中。请让我知道我做错了什么。谢谢
$('input[type=checkbox]').on('click', function(event) {
event.preventDefault();
if($('input[type=checkbox]:checked').length === 1 && $(this).is(':checked')) {
return false;
// there is only one checked AND the checked one is $this and we want to prevent it from uncheck
} else {
$(this).prop('checked', true);
alert($(this).prop('checked')); // this return true
}
});Run Code Online (Sandbox Code Playgroud)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<input type="checkbox" checked="checked"/>
<input type="checkbox"/>
<input type="checkbox"/>Run Code Online (Sandbox Code Playgroud)
我有一个文本输入字段,例如:
<q-input
@blur="checkTextAnswer"
@keyup.enter="submit"
@keydown="checkEnterKey"
v-model.trim="textInput"
Run Code Online (Sandbox Code Playgroud)
当用户点击输入时,我想把它当作提交,即处理输入而不是在文本中添加额外的换行符。
这有点像preventDefaultJQuery 时代。我确实找到了这个:https :
//quasar-framework.org/components/other-utils.html
但似乎更一般的 DOM 事件
我也尝试过只修改字符串(str.replace 换行符),但即使是这种 hack 也有一个丑陋的延迟。
我正在尝试禁用网页上的每个点击事件。
document.addEventListener("click", function (e) {
e.preventDefault();
e.stopImmediatePropagation();
let clicked = e.target;
console.log(clicked);
});Run Code Online (Sandbox Code Playgroud)
这应该可以防止每次点击事件,对吗?但我仍然发现它被忽略的情况(主要是链接)。
我缺少什么?
这是一个问题22我真的无法弄清楚如何解决.以我们主持的HTML5游戏为例:
http://www.scirra.com/arcade/action/93/8-bits-runner - 警告有声音!
该页面是托管的,scirra.com但static1.scirra.net出于安全原因,该游戏位于iframe中.
现在,如果你在玩游戏时向左或向右,向上或向下按,则整个窗口上下左右滚动.当游戏没有集中时,防止默认似乎工作正常.我们希望在玩游戏时防止此默认操作!所以我们使用代码:
var ar = new Array(32, 33, 34, 35, 36, 37, 38, 39, 40, 44);
$(document).keydown(function (e) {
var key = e.which;
if ($.inArray(key, ar) > -1) {
e.preventDefault();
return false;
}
return true;
});
Run Code Online (Sandbox Code Playgroud)
我们将它放在父页面和iframe页面上.当iframe左右焦点似乎被阻挡时,但不是up and down.
任何人都可以帮助我们解决如何停止页面滚动,并仍然允许人们在游戏下方的评论框中键入评论?如果你阻止空格键,它会阻止人们在文本中添加空格!
我这里有这个简单的代码,没什么太先进的.
$("input#send").submit(function(event){
event.preventDefault();
$.ajax({
type: 'POST',
url: add.php,
data: data,
success: success,
dataType: dataType
});
});
Run Code Online (Sandbox Code Playgroud)
当我点击"发送"按钮时,该event.preventDefault功能不起作用,页面加载.
有什么想法吗?
我在我的页面中的两个选项卡之一中有这个链接,但每当我点击a.editReview页面时重新加载并且e.preventDefault()似乎无法正常工作.我知道问题出在其他地方,但我无法真正看到它.
$(document).ready(function() {
/* Activate our reviews */
$().reviews('.starReviews');
$('.tabs a').on("click", function() {
var $this = $(this);
$('.panel').hide();
$('.tabs a.active').removeClass('active');
$this.addClass('active').blur();
var panel = $this.attr('href');
$(panel).fadeIn(250);
return false;
});//end click
$('.tabs li:first a').click();
$("a.editReview").on("click", function(e) {
e.preventDefault();
var reviewId = $(this).data('review-id');
alert(reviewId);
}); //edit review click function
});//document ready function
Run Code Online (Sandbox Code Playgroud)
<div class="eventFeedbackBottomContainer">
<div class="tabs">
<ul>
<li><a href="#panel1" tabindex="1">Reviews</a></li>
<li><a href="#panel2" tabindex="2">Hotels</a></li>
</ul>
</div>
<div class="rightFeedbackBottomContainer">
<a href="/addReview/<?php echo escape($eventReview->getData()->race_id);?>/" id="" class="Smallbut">Add Review</a>
</div>
<div id="panel1" class="panel"> …Run Code Online (Sandbox Code Playgroud) 无法完全禁用双指轻扫手势来浏览整个网站的浏览器历史记录对我来说是一个持续的烦恼.到目前为止,至少可以通过在mousewheel事件上调用preventDefault()来防止这种行为.
这在Chrome 59中似乎不再起作用了.
有人有解决方案吗?
当您在表视图中滚动时,Zenkit和Airtable都会调用preventDefault.它似乎首先工作,但一旦手势被识别,然后至少取消一次(在表格外,防止默认不被调用),防止手势不再起作用(甚至在表格内).因此,从那里开始,向桌面左侧滚动几乎是不可能的,因为它总是触发手势.
在Trello的看板视图中,只有当您位于卷轴的左边缘或右边缘时才会出现.但我想这是因为他们使用原生滚动而Zenkit和Airtable使用css翻译.
一旦用户开始滚动并在之后删除它,我尝试在内容的顶部创建一个不可见的滚动容器.这显着减少了问题,但并不适用于所有情况.
示例代码:https: //codepen.io/anon/pen/gRKaMX
这支笔有3个盒子.
第一个使用overflow:scroll滚动本地.这里只有scrollLeft为0才能触发手势.
第二个附加了一个事件监听器,它在每个mousewheel事件上调用preventDefault.这会首先阻止手势,但一旦您在页面上的任何其他位置启动它,它就不再起作用了.
最后还有第三个div,你可以随时启动手势.
StackOverflow也希望我内联代码,所以这里是:
HTML:
Native Scrolling:
<div id="native-scrolling" class="box">
<div></div>
</div>
Prevent gesture by calling prevent default. Only works if you didn't start the gesture anywhere else, yet:
<div id="prevent-gesture" class="box"></div>
Just a normal div:
<div class="box"></div>
Run Code Online (Sandbox Code Playgroud)
JavaScript的:
$('#prevent-gesture').on('mousewheel', function (event) {
event.preventDefault();
});
Run Code Online (Sandbox Code Playgroud)
CSS:
.box {
height: 100px;
width: 200px;
background: black;
}
#native-scrolling {
overflow: scroll;
}
#native-scrolling > …Run Code Online (Sandbox Code Playgroud) javascript google-chrome gesture preventdefault macos-sierra
preventdefault ×10
jquery ×7
javascript ×6
ajax ×1
checkbox ×1
events ×1
firefox ×1
forms ×1
gesture ×1
html ×1
html5 ×1
iframe ×1
input ×1
macos-sierra ×1
menu ×1
parent ×1
parent-child ×1
toggle ×1