使用jQuery隱藏輸入文本

-2

如何在輸入文字時顯示符號（*）而不是字母的jQuery腳本。文本輸入的值不應改變，只能顯示可見的文本。使用jQuery隱藏輸入文本

輸入類型的密碼不是一個選項，因爲我想讓它可以通過點擊一個按鈕再次看到原文。此外，谷歌瀏覽器中的密碼輸入是自動完成的，在這種情況下，我不希望它自動完成。

2016-11-06 Silver Boy

只需設置你的輸入域'password'的默認類型，並有你的按鈕切換password'和'text'之間'你的輸入類型。向您的字段添加一個「autocomplete」屬性，並將其設置爲「false」。 – ifvictr

我之前發佈了關於自動完成的問題，結果發現無論您做什麼，某些版本的Chrome仍然不會自動完成。但是感謝密碼和文本類型交換的想法。 –

不幸的是，這是Chrome的一項功能。一個問題在這裏發佈了一段時間：https://stackoverflow.com/questions/12374442/chrome-browser-ignoring-autocomplete-off – ifvictr

您應該使用password現場，爲現場

document.getElementById("fooVisible").addEventListener("change", function() { 
 
    if (this.checked) { 
 
    \t return document.getElementById("foo").setAttribute("type", "text"); 
 
    } 
 
    document.getElementById("foo").setAttribute("type", "password"); 
 
})

<input type="password" id="foo" autocomplete="false" /> 
 
Show: <input type="checkbox" id="fooVisible" />

來源

2016-11-06 17:30:15 baao

我試圖把自動補全。它不起作用，但jQuery代碼完美地工作。謝謝。 –

我認爲代碼可能會更好。使用三元運算符會更好：'document.getElementById（「foo」）。setAttribute（「type」，this.checked？「text」：「password」）;' – ifvictr

@Silver Boy這裏沒有jQuery。這是所有的JavaScript。 – TheValyreanGroup

你可以存儲在一個變量的值，並用星號代替所有字符集text/password之間autocomplete="false"和切換。這不會處理刪除或退格，但如果這是您想要的方式，這應該能讓您朝着正確的方向前進。

$(document).ready(function(){ 
 
    var textValue = ""; 
 
    $('.asteriskInput').keypress(function(e){ 
 
    var textLength = $(this).length; 
 
    textValue += e.key; 
 
    $(this).val($(this).val().replace(/[A-Za-z]/g,'*')); 
 
    
 
    }); 
 
    $('#changeInputView').on('click',function(){ 
 
    $('.asteriskInput').val(textValue); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<input class="asteriskInput" type="text" /><br /> 
 
<button id="changeInputView">Show characters</button>

來源

2016-11-06 17:59:37 TheValyreanGroup

對於一個非常小的問題，這是一個非常複雜的解決方案......他只是希望隱藏文本，而不是用星號替換。 – ifvictr

是的，但他的要求是不使用密碼輸入。取代它是唯一的方法。 – TheValyreanGroup

他只是不想使用'password'類型，因爲他希望能夠顯示按下按鈕時鍵入的實際字符。他不知道你可以在'text'和'password'之間切換。問題作者已經接受了完成這個的答案，並且已經接受了我的評論。 – ifvictr

使用jQuery隱藏輸入文本

回答

相關問題