代码之家 › 专栏 › 技术社区 › jon

如何从事件侦听器获取增加或减少值

listener events html javascript

jon · 技术社区 · 7 年前

如何使用侦听器检查输入数是增加还是减少?

我查看了整个事件,没有找到一个属性或方法来显示输入是增加了还是减少了。

我知道我可以从 event.target.step ,但我需要查看增加值以查看它是增加还是减少。

我不想在我的作用域中添加新的全局变量。

我的目标是制作一个比率锁定按钮。

这是我的代码:

    dataIntepretor.oninput = function(event){ // click on a input
        console.log('event: ', event);
        const element = event.target;
        const numberPad = event.data;
        const value = element.value;
        const key = element.id;
        const key2 = element.attributes.id2 && element.attributes.id2.value; //array id
        asignSessionValue(session,key,value,key2);
        if(element.attributes.id2){// if is a array props, look for ratioLock
            const lock = document.getElementById(`${key}_lock`).checked;
            if(lock){
                asignSessionValue(session,key,Number(element.step),~~!key2,true);
                //const element2 = document.querySelectorAll(`#${key}`)[~~!key2];
            }
        }
        refresSpriteSession(objSprite,session);
    };
};

2 回复 | 直到 7 年前

Zahid Saeed 7 年前

那么,您需要创建一个新变量,该变量的值将在每次触发事件时被覆盖,如下所示:

var previousValue = 0; // Let's set the initial value to 0

document.getElementById("myInput").oninput = function()
{
    // You can do something at this moment if you want

    if(this.value > previousValue)
    {
        // Value has been increased
    }
    else
    {
        // Value has been decreased
    }

    previousValue = this.value;
}

否则,如果您不想创建全局变量,那么您可能可以在该输入对象上设置自己的属性,该属性将仅绑定到该输入对象,并且当每次触发事件时,您可以简单地更新该自定义属性的值,而不是更新该全局变量的值。您可以通过使用 this.propertyName 或 event.target.propertyName 每当触发事件时。让我来告诉你怎么做:

var inputField = document.getElementById("myInput");

inputField.previousValue = 0;

inputField.oninput = function()
{
    // You can do something at this moment if you want

    if(this.value > this.previousValue)
    {
        // Value has been increased
    }
    else
    {
        // Value has been decreased
    }

    this.previousValue = this.value;
}

我希望这对你有帮助。请在评论中告诉我:)

Hank Phung 7 年前

您可以切换 readonly 与锁定按钮连接的比率输入上的属性。在删除只读输入之前,用户无法更改其值。

更新:以下是一个活生生的例子: http://jsfiddle.net/0n2Lerae/3/

推荐文章

OREO · 如何在不实际单击复选框的情况下选中它

1 年前

Dan · 在元素外部设置html点击处理程序点击后立即触发

1 年前

Testerr0349349 · 如何通过JDA discord提及用户?

2 年前

abra10834 · Publisher Subscriber-订阅主题中的选定消息

2 年前

Ryan Hibbs · 可脚本化对象事件无法在Unity中注册侦听器(记录类型不匹配)

2 年前

Mero · Svelte在父事件调用上调用新的嵌套事件处理程序

2 年前

Enlico · onkeyup和onkeydown在交错按压和释放时发生干扰

2 年前

iorice · usercontrol dll中的组件事件

2 年前

Awin · 点击事件功能不适用于Vue组件

2 年前

Kiwi · 将可共享的自定义数据添加到事件MS图形api

2 年前