时间戳

首页 > 解决方案 > 循环内递增或递减文本框值（非属性）

javascript - 循环内递增或递减文本框值（非属性）

问题描述

循环中有输入标签 39 次，如下所示

for (i = 0; i <= 39; i++) {
document.write("<button id='minus'>-</button><input type='text' id='input' value='0' ng-model='number" + i + "'><button id='plus'>+</button><br><br>");
};

let pb = document.getElementById("plus");
let mb = document.getElementById("minus");
let text = document.getElementById("input");

pb.onclick = function() {
let x = text.getAttribute("value");
text.setAttribute("value", ++x);
};

mb.onclick = function() {
let x = text.getAttribute("value");
if (x >= 1) {
text.setAttribute("value", --x);
};
};

但是我需要的是当我在循环中单击旁边的按钮时，使用该特定的 ng-model 编号增加/减少文本框的值。

还有那些为上面的“总计”文本框提供信息的文本框，它显示文本框中所有值的加法。所以只是更新值属性不起作用，有点角度，所以请帮我解决这个问题。

( dev.pfokus.com/product/caponi ) 打开这个 url 并选择产品、数量，它会带你选择颜色，观察控制台的行为。在颜色框中写一些数字，总字段得到更新。请检查控制台并帮助我解决添加 +/- 按钮的问题。

（justpaste.it/5tbwj）这是我网站目录中 angular js 指令中的代码。这是从文本框中获取输入值的内容，请尝试使用 +/- 按钮触发它。

这些是当我将“1”添加到文本框以及通过键盘输入将“2”添加到同一文本框时的控制台图像。

在此处输入图像描述

在此处输入图像描述

提前致谢 ：）

标签： javascriptphphtmlangularjs

解决方案

看看 JSFiddle：https ://jsfiddle.net/dLuzemrx/

我也是 Angular JS 的新手，只是做了有问题的工作。任何优化或更正，请随时进行。

JS代码： 

var dataHTML = "";
for (i = 0; i <= 39; i++) {
    dataHTML += '<button ng-click="value_'+ i +' = value_'+ i +' - 1">-</button><input ng-value="value_'+ i +'"><button ng-click="value_'+ i +' = value_'+ i +' + 1">+</button><br><br>';
}
document.querySelector('[ng-app="myApp"]').innerHTML = dataHTML;
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.myVar = "Hello World!";
    for (i = 0; i <= 39; i++) {
        $scope['value_'+ i] = 1;
    }
});

推荐阅读