Question

我正在尝试清除输入类型的密码字段。我尝试过所有的方法，比如

1） $（'＃password'）。val（''）;

2） setTimeout（function（）{$（'＃password'）。val（''）;}，50）;

3） $（“input [type ='password']”）。val（''）;

4） $ scope.model.password ='';

5） document.getElementById（'password'）。value ='';

仅在这些中，第5个已清除我的密码对象，但即使这样，该值也未从HTML页面中清除。只是想知道为什么屏幕保留密码，似乎是HTML中的缓存问题。但问题是model.userName在HTML页面中被清除，而不是密码字段。

这是我的 HTML代码

<div class="modal_sections">
<ul>
    <li>
        <input type="text" ng-keydown="loginKeydown($event)" ng-model="model.userName"> </li>
    <li>
        <input type="password" ng-keydown="loginKeydown($event)" ng-model="model.password" placeholder="***********" id="password"> </li>
</ul>

这是我的控制器代码

   var resetPassword = function () {
        if (condition) {
            $('#password').val('');
            setTimeout(function () { $('#password').val(''); }, 50);
            $("input[type='password']").val('');
            $scope.model.password = '';
            document.getElementById("password").value = "";
            document.getElementById("password").placeholder = "";
        }
    }

有人可以帮我解决这个问题吗？我只是想从HTML页面清除密码。

Answer 1

您在密码字段中添加了一个空格，同时重置删除它。它会完美地运作。

＆＃13;

function clearPassword(){
document.getElementById('password').value = '';
}

function checkValue() {
var passwordFieldValue = document.getElementById('password').value;
alert("Value of password field= " + passwordFieldValue);
}

＆＃13;

<input type="password" ng-keydown="loginKeydown($event)" ng-model="model.password" class="form-control password" placeholder="*****" id="password" autocomplete="off">
<button onClick="clearPassword()">Clear</button>
<button onClick="checkValue()">Check Value</button>

＆＃13;

Answer 2

如果要通过单击某个按钮清除密码字段，请使用

HTML：

<button ng-click = someFunction()>CLick Me </button>

JS：

someFunction(){
     $scope.model.password=null;
 }

Answer 3

如果要完全清除该字段，则还必须清除占位符值。我发布纯js代码，如果你想以不同的方式完成它，你可以轻松地完成它。你明白了

{{1}}

正在运行的代码示例在https://jsfiddle.net/uj8yyp1d/

Answer 4

不使用jQuery，使用ng-model工作正常。确保定义了$scope.model。如果属性未定义，则无法重置某些属性。

var app = angular.module("app",[]);

app.controller("test", function($scope){
	$scope.model={};
	$scope.model.userName = "abc";
	$scope.model.password = "123";
  
	$scope.resetPassword = function () {
		$scope.model.userName = "";
    	$scope.model.password = "";
	}
});

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body ng-app="app">

<div ng-controller="test" class="modal_sections">
<ul>
    <li>
        <input type="text" ng-model="model.userName"> 
    </li>
    <li>
        <input type="password" ng-model="model.password" placeholder="***********" id="password"> 
    </li>
</ul>
<button type="button" ng-click="resetPassword()">Clear</button>
</div>

</body>
</html>

HTML：密码字段未被清除

4 个答案: