我正在尝试实现登录表单，我正在使用我在网上找到的一些模板。我使用append（）函数动态地将它添加到我的页面。登录表格具有以下结构：
<div class="logmod__container">
<ul class="logmod__tabs">
<li data-tabtar="lgm-2" class="current"><a href="#">Login</a></li>
<li data-tabtar="lgm-1"><a href="#">Sign Up</a></li>
</ul>
<div class="logmod__tab-wrapper">
<div class="logmod__tab lgm-1">
<div class="logmod__heading">
<span class="logmod__heading-subtitle">Enter your personal details <strong>to create an acount</strong></span>
</div>
<div class="logmod__form">
<form accept-charset="utf-8" action="#" class="simform">
<div class="sminputs">
<div class="input full">
<label class="string optional" for="user-name">Email*</label>
<input class="string optional" maxlength="255" id="user-email" placeholder="Email" type="text" size="50">
</div>
</div>
<div class="sminputs">
<div class="input string optional">
<label class="string optional" for="user-pw">Password *</label>
<input class="string optional" maxlength="255" id="user-pw" placeholder="Password" type="text" size="50">
</div>
<div class="input string optional">
<label class="string optional" for="user-pw-repeat">Repeat password *</label>
<input class="string optional" maxlength="255" id="user-pw-repeat" placeholder="Repeat password" type="text" size="50">
</div>
</div>
<div class="simform__actions">
<input class="sumbit" name="commit" type="button" value="Create Account">
<span class="simform__actions-sidetext">By creating an account you agree to our <a class="special" href="#" target="_blank" role="link">Terms & Privacy</a></span>
</div>
</form>
</div>
<div class="logmod__alter">
<div class="logmod__alter-container">
<a href="#" class="connect facebook">
<div class="connect__icon">
<i class="fa fa-facebook"></i>
</div>
<div class="connect__context">
<span>Create an account with <strong>Facebook</strong></span>
</div>
</a>
<a href="#" class="connect googleplus">
<div class="connect__icon">
<i class="fa fa-google-plus"></i>
</div>
<div class="connect__context">
<span>Create an account with <strong>Google+</strong></span>
</div>
</a>
</div>
</div>
</div>
<div class="logmod__tab lgm-2 show">
<div class="logmod__heading">
<span class="logmod__heading-subtitle">Enter your email and password <strong>to sign in</strong></span>
</div>
<div class="logmod__form">
<form accept-charset="utf-8" action="#" class="simform">
<div class="sminputs">
<div class="input full">
<label class="string optional" for="user-name">Email*</label>
<input class="string optional" maxlength="255" id="user-email" placeholder="Email" type="text" size="50">
</div>
</div>
<div class="sminputs">
<div class="input full">
<label class="string optional" for="user-pw">Password *</label>
<input class="string optional" maxlength="255" id="user-pw" placeholder="Password" type="password" size="50">
<span class="hide-password">Show</span>
</div>
</div>
<div class="simform__actions">
<input class="sumbit" name="commit" type="button" value="Log In">
<span class="simform__actions-sidetext">
<a class="special" role="link" href="#">Forgot your password?<br>Click here</a>
</span>
</div>
</form>
</div>
<div class="logmod__alter">
<div class="logmod__alter-container">
<a href="#" class="connect facebook">
<div class="connect__icon">
<i class="fa fa-facebook"></i>
</div>
<div class="connect__context">
<span>Sign in with <strong>Facebook</strong></span>
</div>
</a>
<a href="#" class="connect googleplus">
<div class="connect__icon">
<i class="fa fa-google-plus"></i>
</div>
<div class="connect__context">
<span>Sign in with <strong>Google+</strong></span>
</div>
</a>
</div>
</div>
</div>
</div>
我试图通过单击“提交”按钮，使用用户电子邮件和用户-pw ID读取输入数据。我尝试过这样的事情：
var email = document.getElementById('user-email');
var val = email.value;
或
var email = $('#user-email').val();
或
var email = $('#user-email').text();
或
var email = $('#user-email').attr("value");
阅读我输入到输入字段的电子邮件，但所有这些只返回我＆＃34;＆＃34;。 我的最后一次尝试是添加 onfocusout 处理程序，并在那里读取值并将它们存储到全局变量中，然后单击按钮，但这两种方法都不起作用。
答案 0 :(得分：0)
如果您尝试在页面加载时检索值，则您将拥有空值。但是，如果您尝试检索某些事件的值，例如单击“创建帐户”按钮时，您应该能够看到显示的电子邮件值。
请查看下面的我的代码:(我已将您的重复输入ID更改为user-email和user-email2
代码段
$('#create').click(function() {
var email = $('#user-email').val();
console.log(email);
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="logmod__container">
<ul class="logmod__tabs">
<li data-tabtar="lgm-2" class="current"><a href="#">Login</a>
</li>
<li data-tabtar="lgm-1"><a href="#">Sign Up</a>
</li>
</ul>
<div class="logmod__tab-wrapper">
<div class="logmod__tab lgm-1">
<div class="logmod__heading">
<span class="logmod__heading-subtitle">Enter your personal details <strong>to create an acount</strong></span>
</div>
<div class="logmod__form">
<form accept-charset="utf-8" action="#" class="simform">
<div class="sminputs">
<div class="input full">
<label class="string optional" for="user-name">Email*</label>
<input class="string optional" maxlength="255" id="user-email" placeholder="Email" type="text" size="50">
</div>
</div>
<div class="sminputs">
<div class="input string optional">
<label class="string optional" for="user-pw">Password *</label>
<input class="string optional" maxlength="255" id="user-pw" placeholder="Password" type="text" size="50">
</div>
<div class="input string optional">
<label class="string optional" for="user-pw-repeat">Repeat password *</label>
<input class="string optional" maxlength="255" id="user-pw-repeat" placeholder="Repeat password" type="text" size="50">
</div>
</div>
<div class="simform__actions">
<input class="sumbit" name="commit" type="button" value="Create Account" id="create">
<span class="simform__actions-sidetext">By creating an account you agree to our <a class="special" href="#" target="_blank" role="link">Terms & Privacy</a></span>
</div>
</form>
</div>
<div class="logmod__alter">
<div class="logmod__alter-container">
<a href="#" class="connect facebook">
<div class="connect__icon">
<i class="fa fa-facebook"></i>
</div>
<div class="connect__context">
<span>Create an account with <strong>Facebook</strong></span>
</div>
</a>
<a href="#" class="connect googleplus">
<div class="connect__icon">
<i class="fa fa-google-plus"></i>
</div>
<div class="connect__context">
<span>Create an account with <strong>Google+</strong></span>
</div>
</a>
</div>
</div>
</div>
<div class="logmod__tab lgm-2 show">
<div class="logmod__heading">
<span class="logmod__heading-subtitle">Enter your email and password <strong>to sign in</strong></span>
</div>
<div class="logmod__form">
<form accept-charset="utf-8" action="#" class="simform">
<div class="sminputs">
<div class="input full">
<label class="string optional" for="user-name">Email*</label>
<input class="string optional" maxlength="255" id="user-email2" placeholder="Email" type="text" size="50">
</div>
</div>
<div class="sminputs">
<div class="input full">
<label class="string optional" for="user-pw">Password *</label>
<input class="string optional" maxlength="255" id="user-pw" placeholder="Password" type="password" size="50">
<span class="hide-password">Show</span>
</div>
</div>
<div class="simform__actions">
<input class="sumbit" name="commit" type="button" value="Log In">
<span class="simform__actions-sidetext">
<a class="special" role="link" href="#">Forgot your password?<br>Click here</a>
</span>
</div>
</form>
</div>
<div class="logmod__alter">
<div class="logmod__alter-container">
<a href="#" class="connect facebook">
<div class="connect__icon">
<i class="fa fa-facebook"></i>
</div>
<div class="connect__context">
<span>Sign in with <strong>Facebook</strong></span>
</div>
</a>
<a href="#" class="connect googleplus">
<div class="connect__icon">
<i class="fa fa-google-plus"></i>
</div>
<div class="connect__context">
<span>Sign in with <strong>Google+</strong></span>
</div>
</a>
</div>
</div>
</div>
</div>
答案 1 :(得分：0)
您有重复的ID。您有两个带有ID＆＃39; user-email＆＃39;和2个输入id＆＃39; user-pw＆＃39; ID必须是唯一的。它从页面上的最后一个中获取值，这可能不是您将值输入的值