gpt4 book ai didi

javascript - 使用 ng-blur 进行输入验证(如果输入错误则更改背景颜色)

转载 作者:太空宇宙 更新时间:2023-11-04 09:57:32 25 4
gpt4 key购买 nike

我有这个输入类型编号。除了数字之外,它还接受诸如“-”、“.”和 null 之类的字符。

目前,它也接受以下这些值。

1) '.3343..343.33' 
2) '-0.45---.5'

它不应该接受以上值,因为它们不是数字。我正在尝试对其进行验证,以便一旦用户在输入“.3343..343.33”后退出该输入字段,它就会以红色背景突出显示输入字段。这样它会通知用户输入的输入不被接受。

谁能告诉我如何使用 ng-blur 实现此目的。我看到一个也使用 ng-blur 和 ng-model-options。有没有一种简单的方法可以实现这种验证。

最佳答案

试试这个方法,有效

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope) {

$scope.value = true;

$scope.blurT = function(){
// $scope.value = true;
var calc = Number($scope.inputValue) - Number($scope.inputValue);
if(calc == 0){
$scope.value = true;
console.log(calc);
} else {
$scope.value = false;

}

}
$scope.checkClass = function(){
var value = ($scope.value===true ? 'success':'error');
return value;

}

});
/* Put your css in here */

.error {
border:1px solid #f00;
}
<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>document.write('<base href="' + document.location + '" />');</script>
<link href="style.css" rel="stylesheet" />
<script data-semver="1.4.9" src="https://code.angularjs.org/1.4.9/angular.js" data-require="angular.js@1.4.x"></script>
<script src="app.js"></script>
</head>

<body ng-app="plunker" ng-controller="MainCtrl">
<input type="number" ng-class="{'error': value == false}" ng-model="inputValue" ng-blur="blurT()">
{{value}}
</body>

</html>

关于javascript - 使用 ng-blur 进行输入验证(如果输入错误则更改背景颜色),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38595831/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com