如何在.click功能后將文本框設置為空白

Question

所以我有一個簡單的登錄，需要用戶將 json 文件中的值輸入到兩個不同的文本框中，當用戶名和（在這種情況下我使用 ID 作為密碼）匹配時，就會出現一個警報說...... “歡迎”

執行 .click 功能后，用戶文本仍保留在文本框中，如何在 .click 功能后讓兩個文本框都顯示為空白？

$(document).ready(function() {
//Hide alert when page loads
$("#loginalert").hide();
$("#invalid").hide();  
$("#loginbtn").click(function(event){

    $.getJSON('result.json', function(jd) {
        var id = $('#userName').val();
        var name = $('#userName2').val();
        var valid = false;


        for (var i=0; i<jd.user.length; i++) {
            if ((jd.user[i].ID == id) && (jd.user[i].name == name)) {
                valid=true;
                $('#loginalert').html('<img src="' + jd.user[i].imgpath + '"><br><p> Welcome: ' + jd.user[i].name + '</p><button type="button" id="btnhide" class="btn btn-primary btn-md">Hide</button>');      
          //show the alert after loading the information  
                $("#loginalert").stop().fadeIn('slow').animate({ opacity: 1.0 }, 3000)
                $('#invalid').hide();
                $('#btnhide').on('click', function(e){
                    //console.log('here');
                    e.preventDefault();
                    $('#loginalert').hide();
                });

            }
        }
        if (!valid) {
            $('#invalid').fadeIn('slow');
            $('#loginalert').hide();

        }
    });
}); });

用戶名 1 和 #username 2 是文本框 - 當用戶輸入密碼時，有什么方法可以讓用戶名 2 以星 ****** 顯示 - 這個問題不是那么必要，但如果我也能得到這個問題工作會很好。

謝謝大家希望有人可以幫助:)

Answer 1

使用<input type="password">將輸入顯示為星號。

通過將輸入值設置為空來清除輸入： $('#userName').val('') ;

並且也許考慮將您的代碼分解為幾個較小的函數，以便更容易理解。

Answer 2

1. 當用戶輸入密碼時，有什么方法可以讓用戶名 2 以星 ****** 顯示

您可以使用text屬性設置為password的input框。 但是那個密碼掩碼字符將是. 而不是* 。 不完全確定，在某些瀏覽器中它是否會是不同的字符。

<input type="password" id="txtPassword" />

2. .click 函數后文本框顯示為空白

您可以設置這兩個文本框的兩個 jQuery 對象的.val()屬性。

$('#userName, #username2').val('');

Answer 3

document.getElementById("#myTextbox").value=""; 

這應該得到你的文本框並將它的值設置為“”，它是空白的。

編輯： JSFiddle

Answer 4

使用查詢選擇器：

<input id="inputId" type="name" />
<button onclick="click()"> Clear </button>
<script>
    function click() {
        document.querySelector('#inputId').value="";
    }
</script>

Answer 5

另一種方法：

您也可以直接在按鈕內添加腳本，而無需使用/創建函數。

<input id="inputId" type="name" />
<button onclick="document.querySelector('#inputId').value='';"> Clear </button>