無法獲取電子郵件地址的onclick功能

Question

<div id="divForm" class="fancybox" style="display:none;"> 
    <form id="frm_step1" action="download1.php" method="post"> 
     <label>Enter Email</label> 
     <input type="email" name="email" id="email" value="" required /> 
     <input type="button" name="submit" id="submit" value="Submit" class="form-submit" target-form="frm_step1" onclick="test();" /> 
    </form> 
</div> 

function test() { 
    var email = $('#email').text(); 
    alert(email); 
    $.ajax({ 
     type: "POST", 
     dataType: "json", 
     url: 'download1.php?email' + email, 
     data: { 'email': email }, 
     success: function(data) { 
      window.location.href = 'download.php#file'; 
     }, 
     error: function(e) { 
      alert('Error: ' + e); 
     } 
    }); 
} 

我無法從這個獲取電子郵件。當我提醒它時，它將返回空白。 我一直使用這樣的jQuery/AJAX，但這次它不會提示郵件地址。

Answer 1

使用.val()而不是.text()。 .val()方法主要用於獲取表單元素的值，如輸入,選擇和textarea。

$('#email').val(); 

function test() { 
 
    var email = $('#email').val(); 
 
    alert(email); 
 
    $.ajax({ 
 
     type: "POST", 
 
     dataType: "json", 
 
     url: 'download1.php?email' + email, 
 
     data: { 'email': email }, 
 
     success: function(data) { 
 
      window.location.href = 'download.php#file'; 
 
     }, 
 
     error: function(e) { 
 
      alert('Error: ' + e); 
 
     } 
 
    }); 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="divForm" class="fancybox"> 
 
    <form id="frm_step1" action="download1.php" method="post"> 
 
     <label>Enter Email</label> 
 
     <input type="email" name="email" id="email" value="" required /> 
 
     <input type="button" name="submit" id="submit" value="Submit" class="form-submit" target-form="frm_step1" onclick="test();" /> 
 
    </form> 
 
</div>