LocalStorageの値をドロップダウンタイトルに渡す

Question

localStorage値user_idをブートストラップドロップダウンリストのタイトルとして渡そうとしていますが、その理由がわからないのですか？

ドロップダウンリスト項目の見出し/タイトルとして、localStorageの助けを借りてユーザーの名前を表示しようとしていますが、入力ユーザーが 'user_id'に入力したものは、ドロップダウンリストの見出し/タイトルとして使用する必要があります。

function validateLogin() { 
 
    var profile_name = document.getElementById('user_id').value(); 
 
    localStorage.setItem("userID", profile_name); 
 
    document.getElementById('profile-ddl').value = localStorage.getItem('userID'); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 

 
<div> 
 
    <input class="user_login_form" id='user_id' type="text" required tabindex="1" name="user_id" autofocus autocomplete=off placeholder="User Name" /> 
 
</div> 
 

 
<input class="user_login_submit" type="submit" id='btnLogin' tabindex="3" name="login_btnSubmit" value="Submit" onsubmit="return validateLogin()" /> 
 

 
<li class="dropdown"> 
 
    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" id='profile-ddl' aria-expanded="false"> <span class="caret"></span></a> 
 
    <ul class="dropdown-menu"> 
 
    <li><a href='#'>Profile</a></li> 
 
    <li><a href='#'>Setting</a></li> 
 
    <hr/> 
 
    <li class="disabled"><a href='#'>Manage Account</a></li> 
 
    <li class="disabled"><a href='#'>Ledger Account</a></li> 
 
    </ul> 
 
</li>

Answer 1

あなたはタグのvalue属性を持っていけない、代わりにあなたがelement.innerHTMLを使用することができます。