как написать код показа и скрыть поле ввода пароля

Question

В этом вопросе есть следующие ответы на этот вопрос, но я даю лучший ответ на этот вопрос.

  function myFunction() {
      var data = document.getElementById("myInput");
      if (data.type === "password") {
        data.type = "text";
      } else {
        data.type = "password";
      }
    }

<div class="form-group col-md-6">
<label class="control-label">Password</label>
<input type="Password" name="password password1" id="myInput" class="form-control eye" value="{{old('password')}}">
<i class="fa fa-eye" aria-hidden="true" onclick="myFunction()"> Show Hide</i>                                                             {!! $errors->first('password', '<p class="text-warning errorBag">:message</p>') !!}
</div>

Поделитесь моим ответом, пожалуйста

Answer 1

Попробуйте:

<script type="text/javascript">  
            $(document).ready(function () {  
                $('#show_password').hover(function show() {  
                    //Change the attribute to text  
                    $('#txtPassword').attr('type', 'text');  
                    $('.icon').removeClass('fa fa-eye-slash').addClass('fa fa-eye');  
                },  
                function () {  
                    //Change the attribute back to password  
                    $('#txtPassword').attr('type', 'password');  
                    $('.icon').removeClass('fa fa-eye').addClass('fa fa-eye-slash');  
                });  
                //CheckBox Show Password  
                $('#ShowPassword').click(function () {  
                    $('#Password').attr('type', $(this).is(':checked') ? 'text' : 'password');  
                });  
            });  
        </script>  

Answer 2

Вот более короткий подход:

    var input = document.getElementById("myInput");
    function myFunction()
    { input.type = input.type === "password" ? "text" : "password" }

Answer 3

Вы можете попробовать это

html код

<div class="form-group col-md-6">
<label class="control-label">Password</label>
<input type="Password" name="password password1" id="myInput" class="form-control eye" value="{{old('password')}}">
<button class="fa fa-eye" aria-hidden="true" onclick="myFunction()"> Show Hide</button>                                                     </div>

css код

 function myFunction() {
      var data = document.getElementById("myInput");
      if (data.type === "password") {
        data.type = "text";
      } else {
        data.type = "password";
      }
    }

Answer 4

Я не нахожу в вашем коде ошибки или неправильности. Вы можете использовать следующую ссылку для ответа: https://www.w3schools.com/howto/howto_js_toggle_password.asp

Answer 5

function myFunction() {
  var data = document.getElementById("myInput");
  var curType = data[0].getAttribute("type");
  if (curType === "password") {
    data.[0].setAttribute("type","text");

  } else {
    data.[0].setAttribute("type","password");

  }
}