标签: preventdefault

Angular2中有没有办法以某种方式阻止使用EventEmitter的事件的默认值？

我有以下场景:

import {Component, Output, EventEmitter} from 'angular2/core'

@Component({
  selector: 'my-component',
  template: `<button (click)="clickemitter.emit($event); onClick($event)" [style.color]="color"><ng-content></ng-content></button>`
})
export class MyComponent {
  @Output clickemitter: EventEmitter<MouseEvent> = new EventEmitter();

  private color: string = "black";

  constructor() {

  }

  private onClick(event: MouseEvent): void {
    if(!event.defaultPrevented) //gets called before the observers of clickemitter
      this.color = "red";
    else this.color = "blue";
  }
}

@Component({
  selector: 'my-app',
  providers: [],
  template: `
    <my-component (clickemitter)="$event.preventDefault()">Hello Angular</my-component>
  `,
  directives: [MyComponent]
})
export class App {
  constructor() {

  }
}

我做了一个Plunker这一点,太: …

在移动设备的游戏中,如iphone或ipad,<a href="#" onclick="return false">不会阻止默认行为,页面仍然被重定向到'#',为什么......？像这些HTML代码:

<div style="height:1000px; width:100px"></div>
<br />    
<a href="#" onclick="return false">click me</a>

当点击moblie设备的safari时,它会回到页面顶部...

我在jquery中使用鼠标滚轮来增加div的数量,数字正确增加但是在Firefox中没有停止滚动.

$(document).ready(function(){

    $('#test').bind('mousewheel DOMMouseScroll', function(event){

        var currentValue = parseInt($('#test').text(),10),
            newValue = currentValue + 1;

        $('#test').text(newValue);    
        event.preventDefault();
    });
});

小提琴:http://jsfiddle.net/rHVUn/

小提琴使用标准鼠标滚轮检测,但我也使用了Brandon Aaron的鼠标滚轮插件,它也有同样的问题.

删除更新文本的行(我也尝试过html())解决了问题,但这是代码的关键部分,无法删除.

有谁知道如何解决这个问题？

谢谢

更新:我发现问题只发生在我的鼠标直接放在文本上方,如果我的鼠标在框内而不是在文本上(在填充内)滚动停止

我一直在做一些需要我使用空格键来触发事件的东西.我一直在努力的事情要复杂得多,但我把它简化为基础知识,作为我需要做的事情的一个例子.

这个想法是,当空格键被按下时,它会突出显示这个div,当它被放开时它会突出显示.我有一个问题,当我按下空格时,默认是让滚动条分阶段跳下来.为了解决这个问题,我尝试添加防止默认值,然后最终使用return false.

这很棒......直到我意识到当我在输入字段文本框中进行测试时,我已经取消了在打字时放置空间的能力.

我认为我需要的是:

• 在我完成使用后,以某种方式(撤消)防止默认或返回false虽然我无法弄清楚如何执行此操作,因为我需要在整个页面上使用此功能.
• 停止空格键使页面在按住时向下滚动,但仍然可以在键入文本时添加空格.

真的不知道该怎么做.

这是我在这个例子中使用的代码:

HTML

<div class="container">
    <div class="moo">I am moo</div>
    <input/>
</div>

CSS:

.container {
     height:9000px;   
}
.moo {
    border:1px solid black
}
.red {
    background:red;
}
input {
    margin-top:30px;
}

脚本:

$(document).keydown(function(e) {
    if(e.keyCode === 32) {
        $('.moo').addClass('red');
        //event.preventDefault();
        //event.stopPropagation();
        return false;
    }
    else {
        $('.moo').removeClass('moo');
    }
});
$(document).keyup(function(e) {
    if(e.keyCode === 32) {
        $('.moo').removeClass('red');
        event.stopPropagation();
    }
});

在这里演示

现在,我需要event.preventDefault()在我的Vue.js按钮中添加所有点击事件:

<button class="btn btn-primary" v-on:click="someAction($event)">Action</button></p>

methods: {
 someAction (e) {
   e.preventDefault()
   console.log('in some action')
 },
}

有没有人知道某种方式event.preventDefeault()是默认设置？现在,必须event.preventDefault()在每个点击事件中包含它是非常烦人的.

提前致谢!

我知道e.preventDefault();应该阻止空格键在页面上滚动,但它不能用于我的功能

$("html").live("keyup", function (e) {
    var code = (e.keyCode ? e.keyCode : e.which);
    if ((code == 32 || code == 13) && $("span").is(":focus")) {
        openDropdown();
        $(".dropdown a.PivotItem:first").focus();
        e.preventDefault();
    } else if ((code == 32 || code == 13) && $("a.PivotItem").is(":focus")) {
        closeDropdown();
        changeSelected($("*:focus"));
        e.preventDefault();
    } else if (code == 27 && ($("span").is(":focus") || $(".dropdown a.PivotItem").is(":focus"))) {
        closeDropdown();
        $("span").focus();
    } else {
        //do nothing
    }
});

它与.live(我所包含的处理程序有什么关系吗？

任务-为Angular库创建一个可重用的button / anchor标记属性选择的组件，该行为本身的大部分逻辑都绑定在该组件本身上，而不是在HTML标记上。

HTML标记在理想情况下应尽可能整洁

<a routerLink="" attributeSelectorForComponent></a>

问题-尝试[attr.disabled]通过单击侦听器防止锚标记上出现routerLink时触发。

  @HostListener('click', ['$event']) onMouseClick(event: Event) {
    event.stopImmediatePropagation();
    event.preventDefault()
  }

为了简化起见，从等式中删除了禁用的逻辑，无论如何，仍会触发routerLink。

建议的解决方案- 如何有条件地禁用routerLink属性？并不能真正解决我的问题，禁用指针事件只会禁用鼠标事件而不是键盘事件，并且还会阻止我删除指针事件：没有鼠标悬停，单击ect要求相对复杂的操作解决方案，以检测disable属性并相应地删除css，并且通常似乎比正确的解决方案更讲究技巧。

I am using TextInput of react-native-paper on IOS. I want to use preventDefault for button Enter, Tab, , buttons but I can't find the preventDefault method for react-native. Is there a preventDefault method or any other way on react native for IOS?

  const handleKeyPress = ({nativeEvent: {key: keyValue}}: any) => {
    if (['Enter', 'Tab', ','].includes(keyValue)) {
    //want to use preventDefault here

    }
  };

 <TextInput
   keyboardType="email-address"
   mode="outlined"
   placeholder={t('Enter e-mail or several, split by comma')}
   value={email}
   onChangeText={onEmailChange}
   onKeyPress={handleKeyPress}
   error={emailError} …

我在文档的touchstart上使用preventDefault()以防止在页面上滚动.不幸的是,这可以防止太多 用户无法再将焦点放在输入上(并打开软键盘).使用jQuery focus(),我可以将焦点放在touchstart上的输入上.这会在iOS上打开软键盘(大部分时间),但从不在Android上打开.

背景:

我有一个网页,我想尽可能多的移动应用程序.我只关心Android和iOS,但任何形式因素.我首先使页面中的内容与屏幕大小完全相同.这很好,直到用户将手指放在页面上.我需要阻止用户滚动.以下代码实现了这一点,但在两个操作系统上的方式略有不同.

$(document).on('touchstart', function(e) {
    e.preventDefault();
});

在iOS上,这会阻止弹性滚动:用户可以通过尝试滚动页面来显示网页后面的纹理.该功能对于常规网页来说很不错,但在我的情况下它会降低用户体验.

在Android上,防止我用来隐藏地址栏的方便黑客的启示.Android浏览器以地址栏可见开头,但当用户向下滚动页面时,它会消失.要以编程方式强制浏览器隐藏地址栏,只需将此行代码添加到您在load时调用的函数中.

$('html, body').scrollTop(1);

这是告诉Android浏览器我们已经滚动的hacky(但也是唯一的)方法,并且不再需要地址栏.

如果没有文件上的preventDefault,Android浏览器将允许滚动并显示地址栏.

因此,两个操作系统都有充分的理由在文档的每个touchstart上调用preventDefault(),但它可以防止太多.点击输入字段不起作用.使用jQuery focus()调用可以提供帮助,但只能打开iOS上的软键盘,而不是Android.

$('input').on('touchstart', function() {
    $(this).focus();
});

如何阻止页面滚动,但使用浏览器本机功能将焦点放在输入字段上？

注意:此代码

$(document).on('touchstart', function(e) {
    if (e.target.nodeName !== 'INPUT') {
        e.preventDefault();
    }
});

是有缺陷的,因为只要初始触摸源自输入字段内,用户仍然可以滚动页面.

我有一个带有输入字段的简单应用程序，它应该在您键入时插入一段预定义的文本。

我的代码如下所示：

<input type="text" bind="@PetitionInput" onkeydown="@PetitionHandleKeyDown" />
@functions
{
    private int _petitionCharStep = 0;
    private string _petition = "This is a dummy text";
    public string PetitionInput { get; set; } = string.Empty;

    void PetitionHandleKeyDown(UIKeyboardEventArgs arg) {
        PetitionInput += _petition[_petitionCharStep];
        _petitionCharStep++;

        Console.WriteLine(PetitionInput);
    }
}

当输入字段有焦点时，我在键盘上按下一个字母，然后它应该将字符串中的第一个字母添加_petition到输入中。当我按下键盘上的任何字母时，它应该在输入字段中输入第二个字母。等等。

我遇到的问题是它还在我在键盘上按下的输入末尾添加了字母。我想防止这种情况发生。

有没有办法Blazor只使用问题代码来解决这个问题？

我这里有一个在线演示。