如何刪除和添加輸入類型與jQuery

Question

你好我試圖創建一個登錄，一切都可以，但在我的密碼輸入我想要一個跨度，當用戶點擊它顯示密碼，當再次點擊時隱藏密碼在那一刻我只有第一步（顯示密碼）。

Here is the code

Answer 1

你應該試試這個：

$('#xd').on('mouseup', function() { 
    $('#Contraseña').attr('type', 'password') 
}); 

$('#xd').on('mousedown', function() { 
    $('#Contraseña').attr('type', 'text') 
}); 

Code here

Answer 2

使用此代碼

$("button").click(function(){ 
 
    if ($("input").attr("type") == "password"){ 
 
     $("input").attr("type", "text"); 
 
     $(this).text("Hide password"); 
 
    } else { 
 
     $("input").attr("type", "password"); 
 
     $(this).text("Show password"); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="password" /> 
 
<button>Show password</button>

Answer 3

你可以只創建一個變量&它最初這個變量分配給false，現在就點擊更改true和切換attr type

var shown=false; 
    $('#xd').click(function() { 
     shown=!shown; 
     $('#Contraseña').attr('type', shown ? 'text' : 'password') 
    }); 

Answer 4

試試這個;）

<label for="pass_field_id">Password:</label> 
<input type="password" value="your_passowrd" name="password" id="pass_field_id" /> 
<a href="#" onclick="show_hide_password('pass_field_id');" id="showhide">Show</a> 

<script> 
function swapInput(tag, type) { 
    var el = document.createElement('input'); 
    el.id = tag.id; 
    el.type = type; 
    el.name = tag.name; 
    el.value = tag.value; 
    tag.parentNode.insertBefore(el, tag); 
    tag.parentNode.removeChild(tag); 
} 

function show_hide_password(target){ 
    var d = document; 
    var tag = d.getElementById(target); 
    var tag2 = d.getElementById("showhide"); 

    if (tag2.innerHTML == 'Show'){ 

     swapInput(tag, 'text'); 
     tag2.innerHTML = 'Hide'; 

    } else { 
     swapInput(tag, 'password'); 
     tag2.innerHTML = 'Show'; 
    } 
} 
</script>