Rumah > hujung hadapan web > tutorial js > Ringkasan kaedah kawalan biasa untuk operasi jQuery forms_jquery

Ringkasan kaedah kawalan biasa untuk operasi jQuery forms_jquery

WBOY
Lepaskan: 2016-05-16 16:07:58
asal
1018 orang telah melayarinya

Contoh dalam artikel ini meringkaskan kaedah kawalan biasa bagi borang pengendalian jQuery. Kongsikan dengan semua orang untuk rujukan anda. Butirannya adalah seperti berikut:

Kod JS berikut menyenaraikan kaedah biasa untuk jQuery untuk mengendalikan kawalan biasa pada borang (termasuk pilih, kotak radio, kotak pilihan saya percaya mesti ada apa yang anda perlukan

).

Kod HTML untuk pengendalian radio

Radion
<input type="radio" name="rd" id="rd1" checked="checked" value="rd1" />
<input type="radio" name="rd" id="rd2" value="rd2" />
<input type="radio" name="rd" id="rd3" value="rd3" />
Salin selepas log masuk

1. Dapatkan nilai yang dipilih, tiga kaedah tersedia:

$('input:radio:checked').val();
$("input[type='radio']:checked").val();
$("input[name='rd']:checked").val();
Salin selepas log masuk

2. Tetapkan Radio pertama sebagai nilai yang dipilih:

$('input:radio:first').attr('checked', 'checked');
Salin selepas log masuk

atau

$('input:radio:first').attr('checked', 'true');
Salin selepas log masuk

Nota:

attr("checked",'checked')= attr("checked", 'true')= attr("checked",true)
Salin selepas log masuk

3. Tetapkan Radio terakhir sebagai nilai yang dipilih:

$('input:radio:last').attr('checked', 'checked');
Salin selepas log masuk
Salin selepas log masuk

atau

$('input:radio:last').attr('checked', 'true');
Salin selepas log masuk
Salin selepas log masuk

4. Tetapkan mana-mana radio sebagai nilai yang dipilih mengikut nilai indeks:

$('input:radio').eq(索引值).attr('checked', 'true');
Salin selepas log masuk

Nilai indeks=0,1,2....
atau

$('input:radio').slice(1,2).attr('checked', 'true');
Salin selepas log masuk
Salin selepas log masuk

5. Tetapkan Radio sebagai nilai yang dipilih mengikut nilai Nilai

$("input:radio[value='rd2']").attr('checked','true');
Salin selepas log masuk

atau

$("input[value='rd2']").attr('checked','true');
Salin selepas log masuk

6. Padamkan Radio yang Nilainya rd2

$("input:radio[value='rd2']").remove();
Salin selepas log masuk

7. Radio mana yang hendak dipadamkan

$("input:radio").eq(索引值).remove();
Salin selepas log masuk

Nilai indeks=0,1,2....
Jika anda ingin memadamkan Radio ke-3:

$("input:radio").eq(2).remove();
Salin selepas log masuk

8. Radio Traverse

$('input:radio').each(function(index,domEle){
//写入代码
});
Salin selepas log masuk

Kod berikut menunjukkan kaedah operasi biasa DropDownList

DropDownList
<select id="sel">
<option value="1" selected="selected">a</option>
<option value="2">b</option>
<option value="3">c</option>
<option value="4">d</option>
<option value="5">e</option>
</select>
Salin selepas log masuk

1. Dapatkan Nilai item yang dipilih:

$('select#sel option:selected').val();
Salin selepas log masuk

atau

$('select#sel').find('option:selected').val();
Salin selepas log masuk

Dapatkan nilai Teks item yang dipilih:

$('select#seloption:selected').text();
Salin selepas log masuk

atau

$('select#sel').find('option:selected').text();
Salin selepas log masuk

2. Dapatkan nilai indeks item yang dipilih sekarang:

$('select#sel').get(0).selectedIndex;
Salin selepas log masuk

3. Dapatkan nilai indeks maksimum bagi pilihan semasa:

$('select#sel option:last').attr("index")
Salin selepas log masuk

4. Dapatkan panjang Senarai Turun:

$('select#sel')[0].options.length;
Salin selepas log masuk

atau

$('select#sel').get(0).options.length;
Salin selepas log masuk

5. Tetapkan pilihan pertama sebagai nilai yang dipilih:

$('select#sel option:first').attr('selected','true')
Salin selepas log masuk

atau

$('select#sel')[0].selectedIndex = 0;
Salin selepas log masuk

6. Tetapkan pilihan terakhir sebagai nilai yang dipilih:

$('select#sel option:last).attr('selected','true')
Salin selepas log masuk

7. Tetapkan sebarang pilihan sebagai nilai yang dipilih berdasarkan nilai indeks:

$('select#sel')[0].selectedIndex =索引值;
Salin selepas log masuk

Nilai indeks=0,1,2....
8. Tetapkan pilihan dengan Nilai=4 sebagai nilai yang dipilih:

$('select#sel').attr('value','4');
Salin selepas log masuk

atau

$("select#sel option[value='4']").attr('selected', 'true');
Salin selepas log masuk

9. Padamkan pilihan dengan Nilai=3:

$("select#sel option[value='3']").remove();
Salin selepas log masuk

10. Pilihan yang manakah harus dipadamkan:

$(" select#sel option ").eq(索引值).remove();
Salin selepas log masuk

Nilai indeks=0,1,2....
Jika anda ingin memadamkan Radio ke-3:

$(" select#sel option ").eq(2).remove();
Salin selepas log masuk

11. Padamkan pilihan pertama:

$(" select#sel option ").eq(0).remove();
Salin selepas log masuk

atau

$("select#sel option:first").remove();
Salin selepas log masuk

12. Padamkan pilihan terakhir:

$("select#sel option:last").remove();
Salin selepas log masuk

13. Padam senarai jatuh turun:

$("select#sel").remove();
Salin selepas log masuk

14. Tambah pilihan selepas pilih:

$("select#sel").append("<option value='6'>f</option>");
Salin selepas log masuk

15. Tambahkan pilihan di hadapan pilihan:

$("select#sel").prepend("<option value='0'>0</option>");
Salin selepas log masuk

16 Pilihan lintasan:

$(' select#sel option ').each(function (index, domEle) {
//写入代码
});
Salin selepas log masuk

Kod berikut menunjukkan kaedah biasa jQuery untuk mengendalikan kotak semak

CheckBox
<input type="checkbox" id="ck1" name="ck" vlaue="1" checked="checked" />
<input type="checkbox" id="ck2" name="ck" vlaue="2" />
<input type="checkbox" id="ck3" name="ck" vlaue="3" />
<input type="checkbox" id="ck4" name="ck" vlaue="4" />
Salin selepas log masuk

1. Dapatkan satu kotak pilihan item yang dipilih (tiga kaedah penulisan):

$("input:checkbox:checked").val()
Salin selepas log masuk

atau

$("input:[type='checkbox']:checked").val();
Salin selepas log masuk

atau

$("input:[name='ck']:checked").val();
Salin selepas log masuk

2. Dapatkan berbilang kotak pilihan item yang dipilih:

$('input:checkbox').each(function() {
if ($(this).attr('checked') ==true) {
alert($(this).val());
}
});
Salin selepas log masuk

3. Tetapkan kotak semak pertama sebagai nilai yang dipilih:

$('input:checkbox:first').attr("checked",'checked');
Salin selepas log masuk

atau

$('input:checkbox').eq(0).attr("checked",'true');
Salin selepas log masuk

4. Tetapkan kotak pilihan terakhir sebagai nilai yang dipilih:

$('input:radio:last').attr('checked', 'checked');
Salin selepas log masuk
Salin selepas log masuk

atau

$('input:radio:last').attr('checked', 'true');
Salin selepas log masuk
Salin selepas log masuk

5. Tetapkan mana-mana kotak pilihan sebagai nilai yang dipilih berdasarkan nilai indeks:

$('input:checkbox).eq(索引值).attr('checked', 'true');
Salin selepas log masuk

Nilai indeks=0,1,2....
atau

$('input:radio').slice(1,2).attr('checked', 'true');
Salin selepas log masuk
Salin selepas log masuk

6. Pilih berbilang kotak pilihan:
Pilih kotak pilihan pertama dan kedua pada masa yang sama:

$('input:radio').slice(0,2).attr('checked','true');
Salin selepas log masuk

7. Tetapkan kotak semak kepada nilai yang dipilih berdasarkan nilai Nilai:

$("input:checkbox[value='1']").attr('checked','true');
Salin selepas log masuk

8. Padamkan kotak pilihan dengan Nilai=1:

$("input:checkbox[value='1']").remove();
Salin selepas log masuk

9. Kotak semak yang manakah hendak dipadamkan:

$("input:checkbox").eq(索引值).remove();
Salin selepas log masuk

Nilai indeks=0,1,2....
Untuk memadam kotak semak ketiga:

$("input:checkbox").eq(2).remove();
Salin selepas log masuk

10.遍历checkbox:

$('input:checkbox').each(function (index, domEle) {
//写入代码
});
Salin selepas log masuk

11.全部选中

$('input:checkbox').each(function() {
$(this).attr('checked', true);
});
Salin selepas log masuk

12.全部取消选择:

$('input:checkbox').each(function () {
$(this).attr('checked',false);
});
Salin selepas log masuk

希望本文所述对大家的jQuery程序设计有所帮助。

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan