Question

我们正在尝试在ASP.Net文本框中使用Javascript增量器和递减器来提升数值。默认文本框设置为0。

我们追加2个触发Javascript的div来增加和减少ASP.Net文本框中的值。值得改变但是......

我们也有问题，Javascript应该被认为是阻止值低于0.但是，当我们减少到0以下时，文本框变为空白，然后当我们尝试增加时，我们得到一个NaN值。我的计划是当值变为'0'时使减量按钮消失。任何帮助表示赞赏。是否可以在ASP.Net文本框中使用Javascript / jQuery增量器/减量器？

当值达到'0'时，任何关于如何使递减器按钮消失的指针，当值高于'0'时重新出现。如果可以在ASP.Net文本框上使用Javascript递增/递减，则加PL。

提前致谢。

以下是我的Javascript：

  if (Modernizr.mq("screen and (max-width:767px)")) {
        if ($('.product-variant-list td span.quantity input.numerictextboxtext:not([disabled])')) {
            $('input.numerictextboxtext:not([disabled])').parent().append('<div class="incButton button">+</div><div class="decButton button">-</div>');
        }

        if ($('input.numerictextboxtext').val() == 0) {
            $(".decButton").hide();
        }
        if ($('input.numerictextboxtext').val() >= 1) {
            $(".decButton").show();
        }

        $(".button").click(function () {
            var $button = $(this);
            var oldValue = $button.parent().find("input.numerictextboxtext").val();

            //TODO: See if you can show and hide button on based on value of textbox
            if(oldValue == 0){
                $(".decButton").hide();
            }
            if (oldValue >= 1) {
                $(".decButton").show();
            }

            if ($button.text() == "+") {
                var newVal = parseFloat(oldValue) + 1;

            } else {
                // Don't allow decrementing below zero - supposedly. But this does not work in our case
                if (oldValue >= 1) {
                    var newVal = parseFloat(oldValue) - 1;
                }
            }
            $button.parent().find("input.numerictextboxtext").val(newVal);
        });//End button click
    }//End Modernizr check

Answer 1

我认为你的一个问题可能就在这里。我已经改变了格式，使我更清楚地认为问题所在。

if ($button.text() == "+") {
   var newVal = parseFloat(oldValue) + 1;
} else {
   // Don't allow decrementing below zero - supposedly. But this does not work in our case
   if (oldValue >= 1) {
     var newVal = parseFloat(oldValue) - 1;
   }
}
$button.parent().find("input.numerictextboxtext").val(newVal);

newVal在if子句和else子句中声明。但是你在一个不在这些子句之外的表达式中使用它。因此，newVal在您使用val()函数时未定义。

尝试在定义oldVal的位置声明它。

   $(".button").click(function () {
        var $button = $(this);
        var oldValue = $button.parent().find("input.numerictextboxtext").val();
        var newValue = oldValue; // Declaring the variable here gives it 
                                 // the same scope as oldValue.  Giving it 
                                 // oldValue as a default value means that it
                                 // will have a value even if not assigned to again.

        //TODO: See if you can show and hide button on based on value of textbox
        if(oldValue == 0){
            $(".decButton").hide();
        }
        if (oldValue >= 1) {
            $(".decButton").show();
        }

        if ($button.text() == "+") {
            newVal = parseFloat(oldValue) + 1;
        } else {
            // Don't allow decrementing below zero
            if (oldValue >= 1) {
                newVal = parseFloat(oldValue) - 1;
            }
        }
        $button.parent().find("input.numerictextboxtext").val(newVal);
    });//End button click

Answer 2

我们的问题在这里回答。我希望这有助于其他人。

     if (Modernizr.mq("screen and (max-width:767px)")) {
        if ($('.product-variant-list td span.quantity input.numerictextboxtext:not([disabled])')) {
            $('input.numerictextboxtext:not([disabled])').parent().append('<div class="incButton button">+</div><div class="decButton button">-</div>');
        }
        if ($('input.numerictextboxtext').val() == 0) {
            $(".decButton").hide();
        }
        $(".button").click(function () {
            var $button = $(this);
            var oldValue = $button.parent().find("input.numerictextboxtext").val();
            var newVal = oldValue;
            //Hide .decButton for oldValue
            if (newVal == 0 || oldValue == 0) {$button.parent().find(".decButton").hide(); oldValue = 0}
            else {$button.parent().find(".decButton").show();}
            if ($button.text() == "+") { var newVal = parseFloat(oldValue) + 1;} else {
                // Don't allow decrementing below zero
                if (oldValue >= 1) {var newVal = parseFloat(oldValue) - 1;}
            }
            //Hide .decButton for newVal
            if (newVal == 0) {$button.parent().find(".decButton").hide();}
            else {$button.parent().find(".decButton").show();}
            $button.parent().find("input.numerictextboxtext").val(newVal);
        });//End button click
    }//End Modernizr check

ASP.Net文本框上的Javascript / jQuery增量器

2 个答案: