我们经常遇到一些输入框,比如注册网站的输入框就有默认提示值,当获取鼠标焦点的时候,默认值被删除,当用户没输入东西焦点离开的时候,又恢复默认提示值。这方法用js代码实现如下: html代码: 代码如下:<input type="text" id="email" name="email" class="txt_input" value="请输入经常使用的邮箱" onfocus="fn_focus(this);" onblur="fn_blur(this);"/> js代码: 代码如下:function fn_focus(ele){ if(ele.value == ele.de...
现在很多网站都有这种效果,在文本框输入一个字符,下边会出来相匹配的内容,这个代码就演示了这个功能是如何完成的,当然,这是个静态的,你可以将提示的内容从数据库读取出来,要用到AJAX那东东。 代码如下:<HTML><HEAD><title>带输入匹配的文本框</title><style>body,div {font-family:verdana;line-height:100%;font-size:10pt;}input {width:320px;}h1 {text-align:center;font-size:2.2em;}#divc {border:1px solid #555;}.d...
在运用html+css+javascrpt进行页面制作时,我们往往会遇到一些影响用户体验,而又容易被我们忽视的小细节。比如,input输入框中的提示信息,怎样才能根据对象获得和失去焦点而实现其显示和隐藏。今天在这里,想跟大家分享一下这个小技巧,希望各位大神不要拍砖哦~~~ 一、要求 input输入框,在光标显示时,隐藏提示信息;光标离开输入框时,显示提示信息。 二、方法 1、给该input取id名,Onfocus=”方法名1(this)”,onblur=”方法名...
代码如下:<input id="productName" name="productName" class="wid10" type="text" value="" /> 代码如下://绑定商品名称联想 $(#productName).bind(input propertychange, function() {searchProductClassbyName();}); 代码如下:searchProductClassbyName 为触发后调用的方法; 实现效果:
在这里奉上源代码,没有做样式处理,不过功能是可以的,希望大家可以和我交流交流! 代码如下:<html> <head> <title>点击弹出DIV选择信息</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> </head> <body> <input type="text" onfocus="alertDivINFO(t...
同理 此插件不需要任何html标签,只需要一个输入框 有相对应的class类名就ok 且父级有个class类名,其他的都不需要。内部的HTML代码都是自动生成的。 HTML代码如下:代码如下:<div class="parentCls"> <input type="text" class="inputElem"> </div> 其实上面的div标签都可以不需要 只需要在input输入框 且父级元素添加一个如上class(自定义也可以,只是在JS初始化的时候要传入class就ok 我默认情况下 父级class叫parentCls,当前...
如下所示: 代码如下: <script language="javascript" type="text/javascript"> function alertWin(title, msg, w, h) { var titleheight = "22px"; // 窗口标题高度 var bordercolor = "#666699"; //窗口的边框颜色 var titlecolor = "#FFFFFF"; // 窗口的标题颜色 var titlebgcolor = "#666699"; // 窗口的标题背景色 var bgcolor = "#FFFFFF"; // 内容背...
代码: 代码如下:<input type="text" value="fisker" onclick="alert(this.value);" onfocus="this.blur()" /> 输入框无法获得焦点,不能编辑 表单可以获得值。 可以复制。 蛮奇怪的,都选住了,还没有获得焦点? 2,readonly 代码: <input type="text" value="fisker" onclick="alert(this.value);" readonly /> 输入框只读。不能编辑 同样表单可以获得值。 也可以复制。 3,disabled 代码: 代码如下:<input type="text" valu...
需要实现的效果:一个输入框,当输入框未获得焦点的时候,value 值为 “密码”;当输入框失去焦点的时候,输入内容显示为”*****” <input name=”password” type=”text” id=”showPwd” tabindex=”2″ class=”input” value=”密码” /> 我们很直接会想到下面的js $(“#showPwd”).focus(function(){$(this).attr(‘type,password);}); 发现并没有实现预期效果,出现 uncaught exception type property cant be changed 错误...
最近客户需求老是变更,不过有些是因为客户催得急,我没有那么快能完成,所以先做了一个雏形给他们,后来再慢慢改。比如雏形那里我做了一个下拉列表给他们,事实上他们的数据有200多条,用个下拉列表的话很不现实,你能找那么多?而且那个下拉列表该有多长啊?所以很自然的,我想到了百度那个智能提示的功能。 参考了一下之前忘记是哪位大侠写的东西,他的是使用百度api的,为了简单起见,我把数据都定在了js那里,这样看官们容易理...
代码如下:<html> <head> <title>很漂亮、兼容火狐的Js日期选择,自动填充到输入框</title> <meta http-equiv="content-Type" content="text/html;charset=gb2312"> <style type="text/css"> body{font-size:12px;font-family:Verdana,Arial,"宋体";} a:link {color:#464646;text-decoration:none;} a:visited {color:#464646;text-decoration:none;} a:hover{color:#ed145b;text-decoration:underline;} a:active{color:#ed145b;te...
代码如下:<html> <head> <title>Js日期选择器并自动加入到输入框中</title> <meta http-equiv="content-Type" content="text/html;charset=gb2312"> <script type="text/javascript"> var gMonths=new Array("一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"); var WeekDay=new Array("日","一","二","三","四","五","六"); var strToday="今天"; var strYear="年"; var strMonth="月"; ...
代码如下:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">; <html xmlns="http://www.w3.org/1999/xhtml">; <head> <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <%@taglib prefix="s" uri="/struts-tags"%> <title>无标题文档</title> <script language="javascript"> function $(obj){return document.getElementById(o...
代码如下: $("#focus .input_txt").each(function(){ var thisVal=$(this).val(); //判断文本框的值是否为空,有值的情况就隐藏提示语,没有值就显示 if(thisVal!=""){ $(this).siblings("span").hide(); }else{ $(this).siblings("span").show(); } //聚焦型输入框验证 $(this).focus(function(){ $(this).siblings("span").hide(); }).blur(function(){ var val=$(this).val(); if(val!=""){ $(this).siblings("...
1.文本框只能输入数字代码(小数点也不能输入) 代码如下:<input onkeyup="this.value=this.value.replace(/\D/g,)" onafterpaste="this.value=this.value.replace(/\D/g,)"> 2.只能输入数字,能输小数点. 代码如下:<input onkeyup="if(isNaN(value))execCommand(undo)" onafterpaste="if(isNaN(value))execCommand(undo)"> <input name=txt1 onchange="if(/\D/.test(this.value)){alert(只能输入数字);this.value=;}"> 3.数字和小...