如何顯示來自文本字段的用戶輸入

我有一個帶有用戶名，密碼和驗證PIN輸入的表單。用戶輸入他們的用戶名和密碼並單擊登錄，這將取消隱藏允許他們輸入驗證PIN的div。在隱藏的div中，它顯示'你好這個帳戶正在使用驗證PIN'，但是我想知道是否有一種方法可以讓我說'hello //輸入的用戶名//這個帳戶正在使用驗證銷'。我將如何實現這一目標？如何顯示來自文本字段的用戶輸入

該取消隱藏在div

<input class="btn_green_white_innerfade btn_medium" type="button" 
name="submit" id="userLogin" value="Sign in" width="104" height="25" 
border="0" tabindex="5" onclick="showDiv()">

在用戶輸入用戶名的字段的按鈕。

<label for="userAccountName">username</label><br> 
<input class="textField" type="text" name="username" 
id="steamAccountName" maxlength="64" tabindex="1" value=""><br>&nbsp;<br>

，在隱藏的div

<div class="auth_modal_h1">Hello <span 
id="login_twofactorauth_message_entercode_accountname"></span>!</div> 
<p>This account is currently using a verification pin.</p> 
     </div>

任何幫助將不勝感激

來源

2017-08-06 Ashley Blyth

這應該做它顯示了該消息：

var username = document.getElementById("steamAccountName").value 
document.getElementById("login_twofactorauth_message_entercode_accountname").innerText = username

來源

2017-08-06 01:11:38 Svenskunganka

嗨抱歉啞問題，但我在哪裏放置此代碼？ –

在與取消隱藏驗證引腳div相同的功能塊中。 – Svenskunganka

當然是可能的。您可以使用DOM。在您的showDiv() function中，您可以使用dom獲取輸入的用戶名。你可以這樣做：

function showDiv() { 
    const username = document.getElementById("userLogin"); 
    const div = getElementById("login_twofactorauth_message_entercode_accountname") 
    div.getElementsByTagName("p").innerText = "Hy " + username + ", welcome..."; 
}

此代碼應該做的伎倆！

希望得到這個幫助！

來源

2017-08-06 01:13:27

這基本上意味着你添加到div的所有東西都是用jQuery完成的，而不是混合在一起，這可能會導致以後混淆。

將id="username"添加到您的輸入。
將id="modaldiv"添加到你的分區

刪除該分區中的所有內容。

var username = $("#username").val(); 
var divhtml = "Hello " + username + " <span 
    id='login_twofactorauth_message_entercode_accountname'></span>! 
$("#modaldiv").html(divhtml);

來源

2017-08-06 01:15:57 Difster

下面的代碼一定會得到你開始。它允許您通過.value獲得用戶在輸入框中輸入的值，並使用.innerHTML將內容添加到另一個div。

var displayUsername = function() { 
 

 
    var username = document.getElementById('username').value 
 
    
 
    if(username != '') { 
 
    
 
    document.getElementById('message').innerHTML = 'Hello '+username+'!' 
 
    
 
    } 
 

 
}

<input type="text" name="username" id="username"> 
 

 
<button class="clickMe" onclick="displayUsername()">Click ME!</button> 
 

 
<div id="message"></div>

來源

2017-08-06 01:17:37 Ivan

我加一個id = 「反饋」給你的HTML：

<div id="feedback" class="auth_modal_h1" style="display:none;"> 
    Hello <span id="login_twofactorauth_message_entercode_accountname"></span>! 
    <p>This account is currently using a verification pin.</p> 
</div>

然後，我添加此javascript：

<script> 
    function showDiv() { 
     document.getElementById("login_twofactorauth_message_entercode_accountname").innerHTML = document.getElementById("steamAccountName").value; 
     document.getElementById("feedback").style.display = 'block'; 
    } 
</script>

來源

2017-08-06 01:24:57 MrCoincidence

如何顯示來自文本字段的用戶輸入

回答

相關問題