jQuery简单实现input文本框内灰色提示文本效果的方法
本文实例讲述了jQuery简单实现input文本框内灰色提示文本效果的方法。分享给大家供大家参考，具体如下：
$(function(){
$(".grayTips").each(function(){ //遍历每个文本框
var objTextBox=$(this);
var oldText=$.trim(objTextBox.val());
objTextBox.css("color","#888");
objTextBox.focus(function(){
if(objTextBox.val()!=oldText){
objTextBox.css("color","#000");
}
else{
objTextBox.val("").css("color","#888");
}
});
objTextBox.blur(function(){
if(objTextBox.val()==""){
objTextBox.val(oldText).css("color","#888");
}
});
objTextBox.keydown(function(){
objTextBox.css("color","#000");
});
});
});
说明：需要引入jquery.js文件 input和TextBox都有效
$(function(){
$(".grayTip").each(function(){
var $input=$(this);
$input.css("color","#888");
var oldText=$.trim($input.val());
$input.focus(function(){
var newText=$.trim($input.val());
if (newText==oldText){
$input.val("");
}
$input.css("color","#000");
});
$input.blur(function(){
var newText=$.trim($input.val());
if(newText==""){
$input.val(oldText);
$input.css("color","#888");
}
});
});
});
希望本文所述对大家jQuery程序设计有所帮助。
-
本文向大家介绍简单实现的JQuery文本框水印插件，包括了简单实现的JQuery文本框水印插件的使用技巧和注意事项，需要的朋友参考一下 采用JQuery实现文本框的水印效果非常容易，效果如下： 代码片段，定义要应用水印效果的文本框的样式： .watermark { color: #cccccc; } 将JavaScript代码封装成JQuery的插件： 接下来直接在页面上使用： 以上就是本
-
本文向大家介绍jQuery文字提示与图片提示效果实现方法，包括了jQuery文字提示与图片提示效果实现方法的使用技巧和注意事项，需要的朋友参考一下 本文实例讲述了jQuery文字提示与图片提示效果实现方法。分享给大家供大家参考，具体如下： 1.效果如图： 2.文字提示代码： 3.图片提示代码： 更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jQuery常见经典特效汇总》、《jQuery
-
本文向大家介绍js文本框输入内容智能提示效果，包括了js文本框输入内容智能提示效果的使用技巧和注意事项，需要的朋友参考一下 本文实例讲述了js文本框输入内容智能提示效果代码。分享给大家供大家参考。具体如下： 运行效果截图如下： 大体思路： 1.监听文本框事件。这里是用的keyup事件。大家可以尝试用onchange事件。不过感觉keyup事件的效果要好一点。 2.根据输入内容通过ajax异步的方式
-
本文向大家介绍jQuery简单实现彩色云标签效果示例，包括了jQuery简单实现彩色云标签效果示例的使用技巧和注意事项，需要的朋友参考一下 本文实例讲述了jQuery简单实现彩色云标签效果的方法。分享给大家供大家参考，具体如下： 一、JS Code： 二、Html Code： 更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jQuery常用插件及用法总结》、《jQuery常见经典特效汇总
-
本文向大家介绍jQuery实现文本框邮箱输入自动补全效果，包括了jQuery实现文本框邮箱输入自动补全效果的使用技巧和注意事项，需要的朋友参考一下 邮箱自动完成的效果在网站上大多都看过，但是质量参差不齐，今天突然在网上看到一篇博客，感觉这个插件很好，就想来写一下分享给大家！ 效果图如下： 完整demo代码如下： js实现效果代码（jquery.mailAutoComplete-4.0.js）
-
本文向大家介绍jQuery实现简单的点赞效果，包括了jQuery实现简单的点赞效果的使用技巧和注意事项，需要的朋友参考一下 本文实例讲解了jQuery实现简单的点赞效果的详细代码，具体内容如下 效果图： 下面提供一个"点赞"的实例代码，用ASP.NET MVC4+jQuery Ajax实现。 Model： View： Controller： 以上就是本文的全部内容，希望对大家学习jquery程序设