web页面实现emptyText 效果 兼容firefox/google/360

第一步:

$("[name=‘sql‘]").attr({"placeholder" : "内 容"});

结果显示:内 容

第二步:

<textarea name="sql" id="sql" class="mini-textarea" rows="20" required="true" requiredErrorText="SQL不能为空"  emptyText="aaabb cccc"></textarea>

这样写,在谷歌、360都可以换行,火狐不行

第三步:

<textarea name="sql" id="sql" class="mini-textarea" rows="20" required="true" requiredErrorText="SQL不能为空"  ></textarea>

 1     var placeholder="SQL查询注意事项:\r\n(1)目前已自动添加了条数限制,最大为1000条,不需要sql添加条数限制;\r\n(2)where 条件中包含时间的,需使用to_date(...)函数进行转换;\r\n(3)使用自定义函数需加别名;\r\n(4)查询结果提示\"table or view does not exist\"时,需确认数据表是否存在,或者数据源、数据库名是否正确;";
 2     $("[name=‘sql‘]").css({"color" : "gray"});
 3     $("[name=‘sql‘]").val(placeholder);
 4     $("[name=‘sql‘]").focus(function() {
 5         if ($(this).val().contains("SQL查询注意事项:")) {
 6             $(this).val(‘‘);
 7             $(this).css({"color" : "black"});
 8         }
 9     });
10
11     $("[name=‘sql‘]").blur(function() {
12         if ($(this).val() == ‘‘) {
13             $(this).val(placeholder);
14             $(this).css({"color" : "gray"});
15         }
16     });

即可。

时间: 2024-10-17 07:49:16

web页面实现emptyText 效果 兼容firefox/google/360的相关文章

【原】移动web页面兼容处理的思考

本月收到一份关爱里程碑的邮件,入职满3周年了,从一个懵懂的新人到从容淡定的小油条,在外辛苦打工不容易,能收到一封简单的关怀邮件也是有感欣慰,这里祝愿公司越发展越好. 进入主题,移动网页设计中,很多同学常问一个问题:这么多种移动设备,要兼容哪几类呢? 相信很多人会回答主流的系统ios.android,但是这2个系统又有多个版本,如ios就有4.5.6.7,android有2.2.2.3.3.0.4.1.4.2,包括我之前提到winphone 8,大家也在考虑到底该不该兼容,这是一件非常头疼的事情,

申博从零开始平台构建HTML 5 Web页面

申博合作扣9300727 HTML 5是时下Web开发领域炒得火热的一个术语,是的,很多人都看好它,也有很多业内知名公司开始正式使用HTML 5重新构建自己的网站,如YouTube开始使用HTML 5视频,Google已经弃用自家的Gears,开始全面拥抱HTML 5实现离线解决方案,各大浏览器厂家也纷纷开始支持HTML 5,连被人诟病的微软也声称要在IE 9中增加对HTML 5的支持.本文打算为大家详细介绍一下如何构建一个完整的HTML 5 Web页面,以加深对HTML 5的理解. HTML

javascript超过容器后显示省略号效果(兼容一行或者多行)

javascript超过容器后显示省略号效果 在实际的项目中,由于文字内容的长度不确定性和页面布局的固定性,难免会出现文字内容超过div(或其他标签,下同)区域的情况,此时比较好的做法就是当文字超过限定的div宽度后自动以省略号(…)显示,这样,按照习惯,人们都会知道这儿有文字被省略了.css中有个属性叫做text-overflow:ellipsis;比如使用css可以这样写: {width:27em; white-space:nowrap; text-overflow:ellipsis; -o

移动Web页面,为什么都喜欢width=device-width,并且关闭系统缩放功能?

如题,这种方式做的移动Web页面,设计稿通常是按照960*640的规格进行设计,再开发的时候,通常会把里面量到的尺寸缩小一半再开发. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1″> 那既然要缩小一半再开发,为什么不直接设置width=640,然后按照设计稿的尺寸进行开发呢? 对于第一种方法,我暂时能想到好处之后图片缩小了一半,不知道还有什么其

jQuery框架+DWR框架实现的Java Web中的Ajax效果(异步请求,局部刷新)

一 简介和实现效果 这里用一个小例子来简单举例说明,做一个搜索引擎搜索提示效果,通过不断输入字符,然后在下方给出搜索提示.效果图如下: 通过上图可以看到,当输入一个"a"时,提示了很多内容,然后继续输入一个"e"后,提示的范围明显就变小了. 注:在文末我会给出完整源代码的下载链接,以供大家参考 二 具体实现 1 在eclipse for java ee中创建一个Java Web工程,然后导入相应的jar包,特别说明的是:这里要导入一个额外的dwr.jar.也就是说,

web页面相关的一些常见可用字符介绍——张鑫旭

by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1623 正文开始之前先分享两个与字符相关的东西.首先是一张图片,是一张一些字符以及想对应的HTML实体表示的对照图片.如下: 然后是一个页面,是我收集的些杂七杂八字符页面,地址如下:http://www.zhangxinxu.com/sp/character.html 希望这两个东西能对您有所帮助,ok,下面是本文的主要

关于移动web页面viewport详解

这种方式做的移动Web页面,设计稿通常是按照960*640的规格进行设计,再开发的时候,通常会把里面量到的尺寸缩小一半再开发. 移动web端页面设置详解 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=0"/> 涉及到了移动设备(ios, android)的屏幕尺寸问题,d

移动web页面头部书写

HTTP 标题信息(http-equiv) 和页面描述信息(name) http-equiv:该枚举的属性定义,可以改变服务器和用户代理行为的编译.编译的值取content 里的内容.简单来说即可以模拟 HTTP 协议响应头.最常见的大概属于Content-Type了,设置编码类型.如 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> H5中可以简化为 <me

CSS垂直翻转/水平翻转提高web页面资源重用性——张鑫旭

一.CSS下兼容性的元素水平/垂直翻转实现 随着现代浏览器对CSS3的支持愈发完善,对于实现各个浏览器兼容的元素的水平翻转或是垂直翻转效果也就成为了可能.相关的CSS代码如下: /*水平翻转*/ .flipx { -moz-transform:scaleX(-1); -webkit-transform:scaleX(-1); -o-transform:scaleX(-1); transform:scaleX(-1); /*IE*/ filter:FlipH; } /*垂直翻转*/ .flipy