99re伊人,天天插伊人,国产一区二区精品久久岳

下拉框、單選按鈕和多選框的值回顯和取值

2020.05.27

數(shù)據(jù)回顯：


<!DOCTYPE>
<html>
<head>
<title></title>
<script src='http://code.jquery.com/jquery-1.9.1.min.js'></script>
</head>
<body>
<input type='radio' name='gender' value='women' />女
<input type='radio' name='gender' value='man' />男
<hr/>
<select id='city'>
<option value='bj'>北京</option>
<option value='sh'>上海</option>
<option value='gz'>廣州</option>
</select>
<hr/>
<input type='checkbox' name='hobby' value='computer'/>玩電腦
<input type='checkbox' name='hobby' value='swimming'/>游泳
<input type='checkbox' name='hobby' value='phone'/>玩手機
<input type='checkbox' name='hobby' value='running'/>跑步
</body>
</html>

假設用戶是個男人，住在廣州，喜歡玩電腦、游泳，在該頁面進行頁面數(shù)據(jù)的回顯

js：


var gender = document.getElementsByName('gender');
var city = document.getElementById('city');
var hobby = document.getElementsByName('hobby');
gender.forEach(function(item){
if(item.value == 'man'){
item.setAttribute('checked','true');return;
}
});
var opts = city.options;
for(let i=0;i<opts.length;i++){
if(opts[i].value == 'gz'){
opts[i].setAttribute('selected','true');break;
}
}
hobby.forEach(function(item){
if(item.value == 'computer' || item.value == 'swimming'){
item.setAttribute('checked','true');
}
});

jq：


$('input[name='gender']').find('option[value='man']').attr('checked','checked');
$('#city').find('option[value='gz']').attr('selected','selected');
$('input[name='hobby']').each(function(index){
if($(this).val() == 'computer' || $(this).val() == 'swimming'){
$(this).attr('checked','checked');
}
});

取值：


<!DOCTYPE>
<html>
<head>
<title></title>
<script src='http://code.jquery.com/jquery-1.9.1.min.js'></script>
</head>
<body>
<input type='radio' name='gender' value='women' checked='checked'/>女
<input type='radio' name='gender' value='man' />男
<hr/>
<select id='city'>
<option value='bj' select='selected'>北京</option>
<option value='sh'>上海</option>
<option value='gz'>廣州</option>
</select>
<hr/>
<input type='checkbox' name='hobby' value='computer'/>玩電腦
<input type='checkbox' name='hobby' value='swimming'/>游泳
<input type='checkbox' name='hobby' value='phone'/>玩手機
<input type='checkbox' name='hobby' value='running' checked='checked'/>跑步
</body>
</html>

js:


var gender = document.getElementsByName('gender');
var genderValue,hobbyValue;
gender.forEach(function(item){
if(item.checked == true){
genderValue = item.value;
}
});
var city = document.getElementById('city');
var cityIndex = city.selectedIndex; // 選中索引
var cityText = city.options[cityIndex].text; // 選中文本
var cityValue = city.options[cityIndex].value; // 選中值
var hobby = document.getElementsByName('hobby');
hobby.forEach(function(item){
if(item.checked == true){
hobbyValue.push(item.value);
}
});

jq:


var radioVal = $('input[name='gender']:checked').val();
var selectVal = $('#city option:selected').val();
var selectText = $('#city option:selected').text();
var checkboxVal = [];
$('input[name='hobby']:checked').each(function(){
checkboxVal.push($(this).val());
});

判斷checkbox或radio是否被選中：

一般用于閱讀須知(checkbox)

js:


var readed = document.getElementById('readed');
var flag = readed.checked; //true or false

jq:

var flag = $('#readed').is(':checked');    //true or false

本站僅提供存儲服務，所有內容均由用戶發(fā)布，如發(fā)現(xiàn)有害或侵權內容，請點擊舉報。

打開APP，閱讀全文并永久保存查看更多類似文章

【實習面試】阿里&騰訊offer的點點滴滴（內附干貨）

計算機專業(yè)在校生和程序員該如何開始寫技術博文

王垠之怒，海平之笑，碼農之殤

一個半月拿到阿里字節(jié)拼多多美團Offer，最后去了阿里螞蟻金服

程序員靠刷題真的能進大廠嗎？

寫給準備參加秋招的計算機專業(yè)的學弟學妹們~一定要來看哦~

更多類似文章 >>

九色国产,午夜在线视频,新黄色网址,九九色综合,天天做夜夜做久久做狠狠,天天躁夜夜躁狠狠躁2021a,久久不卡一区二区三区

數(shù)據(jù)回顯：

取值：

判斷checkbox或radio是否被選中：