如何在JQuery中知道元素onChange或onTrigger的旧值？

Question

我有一个按钮:

<button id="btn1">55</button>

所以我将按钮值更改为test2

$('#btn1').text("22");

如果按钮oldValue大于newValue,我想显示背景图片.

如何从此按钮获取旧值？

"我有超过100个按钮,它们正在动态变化."

更新:是否有事件在更改之前触发？

Answer 1

您可以使用jQuery的.data()调用并将其存储以便根据需要进行检索.

例如,假设您的HTML是:

HTML

<form action="#" method="GET">
    <input type="text" value="369" />
    <button id="btnID">420</button>
</form>

您可以轻松地首先收集所需的数据并将其与每个元素对齐:

打开脚本

$("button") //  would simply grab all buttons, you can use whatever css selector
    .each(function(i) {
        $(this).data("prevVal", parseInt($(this).text()));
    });

然后,您可以根据需要根据新值检查此值:

... some change function
    $('#btn1').text("22");
    if ($('#btn1').data("prevVal") > 22) {
        //  do work
    }
    $('#btn1').data("prevVal", 22)

仅供参考

如果您使用输入而不是更容易:

$("input").each(function(i) { $(this).data("prevVal", parseInt($(this).val())) })
    .on("change", function(e) {
        var newVal = parseInt($(this).val());
        if ($(this).data("prevVal") > newVal) {
            //  do work
        };
        $(this).data("prevVal" newVal);
    });

或者,如果您想维护一个值列表:

$("input").each(function(i) { 
        $(this).data("vals", new Array());
        $(this).data("vals").push(parseInt($(this).val()));
    })
    .on("change", function(e) {
        $(this).data("vals").push(parseInt($(this).val()));
        var vals = $(this).data("vals");
        if (vals[vals.length-1] > vals[vals.length-2]) {
            //  do work
        };
    });