masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu
Rumah > hujung hadapan web > tutorial js > 基于jQuery的输入框无值自动显示指定数据的实现代码_jquery

基于jQuery的输入框无值自动显示指定数据的实现代码_jquery

WBOY
Lepaskan： 2016-05-16 18:11:29
asal
1004 orang telah melayarinya

【解决方案】

　　1. 准备工作

　　（1）输入框

复制代码 代码如下:



　　（2）CSS代码
复制代码 代码如下:

input.helpText { color: #aaa;}

（3）转换方法
复制代码 代码如下:

function switchText()
{
if ($(this).val() == $(this).attr('title'))
$(this).val('').removeClass('helpText');
else if ($.trim($(this).val()) == '')
$(this).addClass('helpText').val($(this).attr('title'));
}

（4）具体实现
复制代码 代码如下:

$('input[type=text][title!=""]').each(function() {
if ($.trim($(this).val()) == '') $(this).val($(this).attr('title'));
if ($(this).val() == $(this).attr('title')) $(this).addClass('helpText');
}).focus(switchText).blur(switchText);

$('form').submit(function() {
$(this).find('input[type=text][title!=""]').each(function() {
if ($(this).val() == $(this).attr('title')) $(this).val('');
});
});

2. 参考文章
http://webservices.blog.gustavus.edu/2008/06/23/text-input-example-text-with-jquery/
Label berkaitan：
Kotak masukan
sumber：php.cn
Artikel sebelumnya：JQuery动态给table添加、删除行 改进版_jquery Artikel seterusnya：javascript对数组的常用操作代码 数组方法总汇_javascript技巧
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
Artikel terbaru oleh pengarang
Isu terkini
Tidak dapat mendapatkan elemen input daripada tapak web Jadi saya cuba mendapatkan elemen input daripada Twitter tetapi apabila saya menjalankanny...
daripada 2024-04-06 18:59:57
0
1
442
Dapatkan jumlah nilai pulangan kaedah medan input Saya cuba mencari jumlah nilai yang dimasukkan oleh pengguna. Dapatkan agregat yang mendar...
daripada 2024-04-06 18:19:37
0
1
380
Merekod pertanyaan di bawah syarat nilai separa - perkongsian kemahiran SQL Saya mempunyai jadual yang dipanggil zipcode yang mempunyai lajur yang dipanggil kod. Laju...
daripada 2024-04-06 16:01:26
0
1
395
Walaupun selepas mengosongkan, nilai input fail saya kekal Seperti yang anda boleh lihat dalam tangkapan skrin. Saya memilih fail, menyimpan pop timb...
daripada 2024-04-06 15:44:52
0
1
384
Pelapik ibu bapa tidak diendahkan oleh anak yang berkedudukan melekit Bagaimana untuk mengelakkan unsur melekit daripada berada di belakang pengepala? Coretan k...
daripada 2024-04-06 11:42:51
0
1
338
Topik-topik yang berkaitan
Lagi>
Cadangan popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan