Phương Thức Val() Trong JQuery | Lấy Giá Trị Thuộc Tính Value Của ...

Phương thức val() trong jQuery

1) Phương thức val() trong jQuery

- Phương thức val() dùng để thiết lập hoặc trả về giá trị của phần tử.

- Lưu ý: Phần tử ở đây chính là các phần tử thuộc dạng <input>, <textarea>, <select>

2) Cách sử dụng phương thức val() trong jQuery

- Đối với phương thức val(), chúng ta có ba trường hợp sử dụng tương ứng với ba loại cú pháp:

2.1) Lấy giá trị của phần tử

- Dưới đây là cú pháp dùng để lấy giá trị của phần tử:

$(selector).val();

- Lưu ý: Nếu bộ chọn tìm được nhiều phần tử trùng khớp thì phương thức val() chỉ trả về giá trị của phần tử trùng khớp được tìm thấy đầu tiên.

2.2) Thiết lập lại giá trị của phần tử

- Dưới đây là cú pháp dùng để thiết lập lại giá trị của phần tử:

(cú pháp này thường được sử dụng trong trường hợp bộ chọn chỉ tìm được một phần tử trùng khớp hoặc bạn muốn tất cả các phần tử trùng khớp đều được thiết lập chung một giá trị)

$(selector).val(value);

- Trong đó, tham số "value" là giá trị mà bạn muốn thiết lập cho phần tử.

2.3) Thiết lập lại giá trị của phần tử (sử dụng hàm)

- Dưới đây là cú pháp dùng để thiết lập lại giá trị của phần tử bằng cách sử dụng hàm:

(cú pháp này thường được sử dụng trong trường hợp bộ chọn tìm được nhiều phần tử trùng khớp và bạn muốn mỗi phần tử trùng khớp được thiết lập một giá trị riêng)

$(selector).val(function(index,currentvalue){ return value; });

- Dưới đây là bảng mô tả ý nghĩa & cách sử dụng các tham số trong cú pháp trên:

function(index,currentvalue){ return value; }

- Chỉ định một hàm trả về giá trị mà bạn muốn thiết lập lại cho phần tử.

- Trong đó:

  • Tham số "index" trả về chỉ số của phần tử được chọn trong danh sách các phần tử trùng khớp được tìm thấy.
  • Tham số "currentvalue" trả về giá trị hiện tại của phần tử được chọn.
  • "value" là giá trị mà bạn muốn thiết lập lại cho phần tử.

3) Một số ví dụ

Ví dụ:

- Lấy giá trị của phần tử <input> có tên là hoten

<script> $(document).ready(function(){ $("button").click(function(){ var a = $("input[name='hoten']").val(); }); }); </script> Xem ví dụ Ví dụ:

- Thiết lập lại giá trị của phần tử <input> có tên là hoten thành "NGUYỄN THÀNH NHÂN"

<script> $(document).ready(function(){ $("button").click(function(){ $("input[name='hoten']").val("NGUYỄN THÀNH NHÂN"); }); }); </script> Xem ví dụ Ví dụ:

- Thiết lập lại giá trị (tùy trường hợp) của các phần tử <input>

<script> $(document).ready(function(){ $("button").click(function(){ $("input[type='text']").val(function(a,b){ if(a==0){return "Lữ Bố";} if(a==1){return b;} if(a==2){return b + " - Tào Tháo";} }); }); }); </script> Xem ví dụ

Từ khóa » Gán Giá Trị Cho Thẻ Input Trong Javascript