當(dāng)前位置:首頁 >  站長(zhǎng) >  編程技術(shù) >  正文

Jquery操作radio、checkbox、selelct選中及獲取選中值

 2020-10-29 09:39  來源: 馮奎博客   我來投稿 撤稿糾錯(cuò)

  域名預(yù)訂/競(jìng)價(jià),好“米”不錯(cuò)過

在我們編寫程序的時(shí)候,經(jīng)常會(huì)對(duì)元素選中,或是獲取選中的值,

在這篇文章中,我們介紹使用 Jquery 操作radio、checkbox、select選中及獲取選中值,

獲取選中的值時(shí),我們使用 val() 來獲取,

元素的選中 我們使用 attr 或 poro 來進(jìn)行屬性操作,

下面就是具體使用示例:

一、Radio 單選框

1、獲取選中的值

$("input[name='name名稱']:checked").val();

2、操作選中使用(attr 或 poro)

$("input[name='sex']").attr("checked", true); // 選中

$("input[name='sex']").attr("checked", false); // 取消選中

3、判斷是否選中

// 選中為true,沒選中為false

$("input[type='radio']:eq(1)").prop("checked");

$("input[type='radio']:eq(1)").is(":checked");

二、Checkbox 復(fù)選框

1、獲取選中的值

$("input[type='checkbox']:checked").each(function(){

console.log($(this).val());

})

2、操作選中使用(attr 或 poro)

$("input[type='checkbox']:eq(1)").attr("checked", true); // 選中

$("input[type='checkbox']:eq(1)").attr("checked", false); // 取消選中

3、判斷是否選中

// 選中為true,沒選中為false

$("input[type='checkbox']:eq(1)").prop("checked");

$("input[type='checkbox']:eq(1)").is(":checked");

三、Select 下拉框

1、獲取選中的值

$("select option:selected").text()

$("select").find('option:selected').text()

$("select").val();

2、操作選中使用(attr 或 poro)

$("select option:eq(1)").attr("selected", true); // 選中

$("select option:eq(1)").attr("selected", false); // 取消選中

3、判斷是否選中

// 選中為true,沒選中為false

$("select option:eq(1)").is(":selected");

文章轉(zhuǎn)自馮奎博客,原文鏈接:https://fengkui.net/article/141

申請(qǐng)創(chuàng)業(yè)報(bào)道,分享創(chuàng)業(yè)好點(diǎn)子。點(diǎn)擊此處,共同探討創(chuàng)業(yè)新機(jī)遇!

相關(guān)標(biāo)簽
jquery教程

相關(guān)文章

熱門排行

信息推薦