jQuery 之表單操作

renweihub 發(fā)布于2019-08-20 18:36 / 1890人閱讀

摘要：一獲取表單元素除了使用和選擇器之外，對(duì)于表單元素還可通過以及屬性選擇表單元素，實(shí)例二獲取設(shè)置表單元素的值文本框文本域當(dāng)表單的值為字符串時(shí)，可用方法去除字符串前后的空格方法不傳參數(shù)，視為獲取值，否則視為設(shè)置值單選多選判斷是否選中設(shè)置選中狀態(tài)第

一、獲取表單 DOM 元素

除了使用 id 和 class 選擇器之外，對(duì)于表單元素還可通過 type 以及 name 屬性選擇表單元素，實(shí)例：

$("input[type="radio"]")

$("input[type="checkbox"]")

$("input[name="username"]")

二、獲取/設(shè)置表單元素的值 （1）文本框、文本域

當(dāng)表單的值為字符串時(shí)，可用 $.trim() 方法去除字符串前后的空格

val() 方法不傳參數(shù)，視為獲取 value 值，否則視為設(shè)置 value 值
$("input[type="text"]").val()

（2）單選、多選

判斷是否選中：
$("input[type="radio"]").is(":checked")

設(shè)置選中狀態(tài)（第二個(gè)參數(shù)為 false，則取消選中）：
$("input[type="radio"]").prop("checked", true)

三、隱藏域 基本語(yǔ)法：

特點(diǎn)：

對(duì)于網(wǎng)頁(yè)訪問者來說，隱藏域是不可見的

表單提交時(shí)，隱藏域會(huì)將自身的 name 和 value 發(fā)送到服務(wù)器

用途：

收集發(fā)送數(shù)據(jù)，可以處理一些特殊的數(shù)據(jù)，比如用戶身份

只能用于簡(jiǎn)單的數(shù)據(jù)儲(chǔ)存和傳遞

四、提交表單

在提交表單時(shí)需將表單元素集合的值傳遞給后臺(tái)，serialize() 的作用是將選擇的表單元素的 vlaue 值序列化為字符串。

實(shí)例：

$.ajax({
    url: "your_url",
    type: "POST",
    data: $("form").serialize(),
    success: function () {
        // some code
    },
    error: function () {
        // some code
    }
})

GPU云服務(wù)器云服務(wù)器 jquery表單插件 jquery表單提交 jQuery表單樣式 jquery表單元素

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/84746.html

相關(guān)文章

jQuery設(shè)計(jì)思想之理解篇

摘要：創(chuàng)建新元素的方法非常簡(jiǎn)單，只要把新元素直接傳入的構(gòu)造函數(shù)就行了七工具方法設(shè)計(jì)思想之六除了對(duì)選中的元素進(jìn)行操作以外，還提供一些與元素?zé)o關(guān)的工具方法。八事件操作設(shè)計(jì)思想之七，就是把事件直接綁定在網(wǎng)頁(yè)元素之上。轉(zhuǎn)自：阮一峰 2011年7月26日 http://www.ruanyifeng.com/blo... jQuery是目前使用最廣泛的JavaScript函數(shù)庫(kù)。據(jù)統(tǒng)計(jì)，全世界排名...

newsning 2019-08-20 16:12 評(píng)論0 收藏0
代碼片段之jQuery控制input只能輸入數(shù)字和兩位小數(shù)

摘要：前言做為一個(gè)，難免會(huì)遇到那種表單中限制輸入的問題，比如，限制空格的輸入，只允許輸入數(shù)字，以及小數(shù)點(diǎn)的控制等等，這里，我們就說一下數(shù)字的限制。 showImg(https://segmentfault.com/img/remote/1460000019199762?w=1350&h=900); 前言做為一個(gè)PHPER，難免會(huì)遇到那種表單中jQuery限制輸入的問題，比如，限制空格的輸入...

iOS122 2019-08-26 13:48 評(píng)論0 收藏0
代碼片段之jQuery控制input只能輸入數(shù)字和兩位小數(shù)

摘要：前言做為一個(gè)，難免會(huì)遇到那種表單中限制輸入的問題，比如，限制空格的輸入，只允許輸入數(shù)字，以及小數(shù)點(diǎn)的控制等等，這里，我們就說一下數(shù)字的限制。 showImg(https://segmentfault.com/img/remote/1460000019199762?w=1350&h=900); 前言做為一個(gè)PHPER，難免會(huì)遇到那種表單中jQuery限制輸入的問題，比如，限制空格的輸入...

MingjunYang 2019-07-01 12:47 評(píng)論0 收藏0
jQuery Validate 表單驗(yàn)證之強(qiáng)大插件

摘要：返回為真，表示需要驗(yàn)證。注意在文件中添加只能包括中文字英文字母數(shù)字和下劃線。中文名稱返回類型描述驗(yàn)證所選的。檢查是否驗(yàn)證通過。提交表單后，未通過驗(yàn)證的表單第一個(gè)或提交之前獲得焦點(diǎn)的未通過驗(yàn)證的表單會(huì)獲得焦點(diǎn)。 jQuery Validate 插件為表單提供了強(qiáng)大的驗(yàn)證功能，讓客戶端表單驗(yàn)證變得更簡(jiǎn)單，同時(shí)提供了大量的定制選項(xiàng)，滿足應(yīng)用程序各種需求。該插件捆綁了一套有用的驗(yàn)證方法，包括 ...

zorpan 2019-08-20 17:02 評(píng)論0 收藏0
前端技術(shù) 博客文章、書籍積累

摘要：好多編輯器例如等都支持這樣的語(yǔ)法來快速的編寫代碼如何優(yōu)雅地使用把標(biāo)簽放在結(jié)束標(biāo)簽之后結(jié)束標(biāo)簽之前的差別什么是響應(yīng)式設(shè)計(jì)怎樣進(jìn)行書籍《JavaScriptDOM編程藝術(shù)》《JavaScript高級(jí)程序設(shè)計(jì)》《JavaScript框架設(shè)計(jì)》《JavaScript專家編程》《JavaScript Ninjia》《JavaScript語(yǔ)言精粹（修訂版）》《JavaScript設(shè)計(jì)模式》《J...

LiangJ 2019-08-30 12:58 評(píng)論0 收藏0