我正在使用 JQuery 3.6 并且我正在嘗試在頁面上創建一個簡單的電子郵件注冊片段。
我很驚訝，當我在輸入中輸入電子郵件并單擊按鈕時，警報框顯示為空白。當我使用代碼檢查器時，我得到了相同的結果。元素被正確識別和選擇，但由于某種原因，我似乎無法提取輸入框中輸入的電子郵件值。
這是我的標記和最小的 Javascript：
<div class="g-mb-30">
<div class="input-group border-0 rounded">
<input id="newsletter-subscription-email" class="form-control border-0 g-pa-12" type="email" title="Subscribe to our newsletter!" placeholder="Email address">
<div class="input-group-append p-0">
<button id="newsletter-subscribe" class="btn btn-primary" type="submit" role="button">Subscribe</button>
</div>
</div>
</div>
<script type="text/javascript">
function isValidEmail(some_email){
/* impl detail */
}
$().ready(function(){
$('#newsletter-subscribe').on('click', function(e){
let email = $('#newsletter-subscription-email').val().trim().toLowerCase();
alert(email); // displays blank if even I type an email address
if (email.length && isValidEmail(email)) {
e.preventDefault();
// some logic ...
}
}
});
</script>
為什么地址沒有被正確檢索 - 因為選擇器 CSS 是正確的 - 我該如何解決這個問題以正確檢索輸入的電子郵件？
uj5u.com熱心網友回復：
幾個月前我和你遇到了同樣的事情。最后發現有兩個ID相同的控制元件，jquery總是選擇ID相同的第一個
您的代碼是完美的，請檢查是否有多個具有該 ID 屬性的輸入
uj5u.com熱心網友回復：
可能是 $()ready(function(){ 以及缺少的 }); 在js中。
$(function() {
$('#newsletter-subscribe').on('click', function(e){
let email = $('#newsletter-subscription-email').val().trim().toLowerCase();
alert(email); // displays blank if even I type an email address
if (email.length && isValidEmail(email)) {
e.preventDefault();
// some logic ...
}
});
}); <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>
<div class="g-mb-30">
<div class="input-group border-0 rounded">
<input id="newsletter-subscription-email" class="form-control border-0 g-pa-12" type="email" title="Subscribe to our newsletter!" placeholder="Email address">
<div class="input-group-append p-0">
<button id="newsletter-subscribe" class="btn btn-primary" type="submit" role="button">Subscribe</button>
</div>
</div>
</div>轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/396294.html
標籤：javascript 查询