jQuery val（）方法不起作用

Question

我想读取以我的一种HTML形式在文本框中输入的值，为此，我尝试了jQuery val()方法，但是它不起作用，为什么？

HTML：

<form method="POST" id="payment-form">
   <p>
      <label class="card-number" for="txt_cardno"><span>Card Number:</span></label>
      <input type="text" size="20" autocomplete="off" class="card-number" id="txt_cardno" name="cardno" />
   </p>
   <p class="submit submit-button"><a class="btn" href="#">Charge Card</a><br><a class="btn" href="#" onClick="return false">Go Back</a></p>
   <div class="clear"></div>
</form>

Javascript：

$(document).ready(function() {
    $(".submit").live("click", function(e) {
        e.preventDefault();
        var card_num = $('.card-number').val();
        alert(card_num);
    });
});

jsfiddle是http://jsfiddle.net/74neK/1/

Answer 1

使用ID来访问它（更快）：

 var card_num = $('#txt_cardno').val();

Answer 2

您已经为<label>和<input>赋予了"card-number"类。

在选择器中指定input 。 否则， .val()会为您提供找到的第一个元素（ label ）的值。

var card_num = $('input.card-number').val();

http://jsfiddle.net/74neK/3/

---

如果您确实在意微优化，则应使用本机方法：

var card_num = (document.getElementById('txt_cardno')||{}).value;

http://jsfiddle.net/74neK/5/

Answer 3

您的<label>的class与您的<input>的class相同，因此jQuery正在尝试并且无法检索您的<label>的值。 而是通过name或id来引用<input> ：

$('#txt_cardno').val()

无论如何我都会推荐ID，因为jQuery将其优化为document.getElementById ，这要快得多。

Answer 4

尝试使用ID来访问元素：

var card_num = $('#txt_cardno').val();

http://jsfiddle.net/74neK/4/ <-示例

Answer 5

选择输入元素的id ，而不是class ： http : //jsfiddle.net/btgxu/