首頁 > web前端 > js教程 > jQuery中val方法的功能及範例

jQuery中val方法的功能及範例

WBOY
發布: 2024-02-28 14:39:03
原創
1130 人瀏覽過

jQuery中val方法的功能及範例

jQuery中val方法的功能及範例

在使用jQuery程式設計時,經常會涉及到取得或設定表單元素的值。這時候就可以用到jQuery中的val()方法。 val()方法是jQuery中的常用方法,用於取得或設定表單元素的值。在本文中,我們將詳細討論val()方法的功能,以及透過具體程式碼範例來展示它的用法。

一、val()方法的功能

val()方法用於取得或設定表單元素的值,這些表單元素包括input、textarea和select等。當val()方法不帶參數時,它會傳回符合元素集合中第一個元素的目前值。當val()方法帶一個參數時,它會設定所有符合元素的值。

二、範例程式碼

以下是一些範例程式碼,展示如何使用val()方法取得或設定表單元素的值。

  1. 取得input輸入框的值

假設我們有一個輸入框,現在我們想要取得使用者輸入的值並輸出到控制台:

var username = $("#username").val();
console.log(username);
登入後複製
  1. 設定input輸入框的值

如果我們想要在輸入方塊中設定預設值,可以使用val()方法:

$("#username").val("John Doe");
登入後複製
  1. 取得select下拉選單的值

假如我們有一個下拉式選單