Passing LocalStorage value to a drop down title

Question

I'm trying to pass the localStorage value user_id as a title of Bootstrap drop down list, But not sure why its not working.

I'm trying to show user's name as a heading/title of drop down list items with the help of localStorage, whatever input user gives in 'user_id' should be used as heading/title of drop down list.

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。