若輸入框有誤，則點擊立即注冊，輸入框的顏色會變成紅色，在輸入框中輸入正確的值的過程中，輸入框的邊框變成正常的顏色。

用??戶??名

id="form_item_account"

ng-model="account"

name="account"

required

ng-pattern="regularList.account"

ng-class="{'warnning':checkForm.account.$focused,'error':(!isEmpty && checkForm.account.$blured &&

checkForm.account.$error.pattern) || (isEmpty && checkForm.account.$invalid)}"

ng-blur="checkForm.account.$blured = true;checkForm.account.$focused = false;"

ng-focus="checkForm.account.$focused = true;checkForm.account.$blured = false;accountValid()"

autocomplete="off"

>

支持中文、字母、數字、“-”“_”的組合，4-20個字符

請輸入用戶名

請輸入正確的用戶名

立即注冊

.controller{

var form_account = $("#form_item_account");

var form_pwd = $("#form_item_password");

function getStringLength(str){

if(!str){

return;

}

var bytesCount = 0;

for(var i=0;i

var c=str.charAt(i);

if(/^[\u0000-\u00ff]&/.test(c)){

bytesCount+=1;

}else{

bytesCount+=2;

}

}

return bytesCount;

}

function onKeyupHandler(input,msg){

var item = input.parent();

if(!item.hasClass('form_item_error')){

item.addClass('form_item_error');

}

}

function hideError(input,msg){

var item = input.parent();

item.removeClass('form_item_error');

}

$scope.checkAcount = function(){

var reg = /^[A-Za-z0-9_\-\u4e00-\u9fa5]+$/;

form_account.on('keyup',function(e){

var value = $(this).val();

hideError(form_account);

if(value!='' && !reg.test(value)){

onKeyupHandler(form_account,errormsg)

}

})

}

$scope.confirm = function () {

$scope.accountValid = function(){

if($scope.checkForm.account.$error ){

$('#form_item_account').addClass('form_item_error');

}

}

}

求指點？

謝謝

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的html 输入框变红色,input输入框 输入错误时，点击注册按钮，输入框的边框变成红色，重新输入时，边框颜色恢复原来的，同时错误提示消失？...的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。