<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title></title>

<script type="text/javascript" src="http://static.mtimg.net/js/jquery-1.7.2.min.js"></script>

<script type="text/javascript">

$(function(){

/*

    $lineSearchbg.each(function(){

        //搜索框 请输入目的地、主题或关键词

        $(this).find('.placeholder').focus(function(){

            var arrive = $(this).val();

            if(arrive == '请输入目的地、主题或关键词'){

            $(this).val('').css('color','#000');

            }

        });

        $(this).find('#arriveSearchText').blur(function(){

            var arrive = $(this).val();

            if(arrive == ''){

                $(this).val('请输入目的地、主题或关键词').css('color','#b5b5b5');

            }

        });

    });

*/

        //搜索框 请输入目的地、主题或关键词

        $('.placeholder').focus(function(){

            if( $(this).val() == $(this).attr("placeholder") ){

                $(this).val('').css('color','#000');

            }

        });

        $('.placeholder').blur(function(){

            if( $(this).val() == ''){

                $(this).val( $(this).attr("placeholder") ).css('color','#b5b5b5');

            }

        });

});

</script>

<style type="text/css">

input{width:400px;margin:10px;}

</style>

</head>

<body>

<input type="text" class="" placeholder="啊啊啊啊啊啊啊啊">有placeholder，没有class<br>

<input type="text" class="placeholder">没有placeholder，有class<br>

<input type="text" class="placeholder" placeholder="啊啊啊啊啊啊啊">有placeholder，有class<br>

<input type="text" default="有default"><br>

</body>

</html>

placeholder测试的更多相关文章

  1. 怎么修改placeholder字体的css样式

    修改palceholder内文字的css样式 ::-webkit-input-placeholder{ color: red; font-size: 20px; line-height: 50px; ...

  2. 修改 input中的placeholder的字体样式和颜色

    placeholder属性是css3中新增加的属性, 由于是新加入的属性因此对各大浏览器都不兼容: 因此在使用的时候要加兼容性 火狐:-moz-placeholder { /* Mozilla Fir ...

  3. 【HTML】placeholder中换行

    表示回车 表示换行 案例 <textarea rows="10" placeholder="测试换行 新的一行"></textarea>

  4. HTML5 placeholder实际应用经验分享及拓展

    QQ邮箱登陆(http://mail.qq.com) 如下截图啦: 我在上面一个demo类似原理上做了下修改,制作了一个这样子交互效果的demo,希望对有兴趣的同行能帮上点忙,您可以狠狠地点击这里:透 ...

  5. ng1.3+表单验证<AngularJs>

    前一篇文章说过,ng1.3+以后对于表单验证有了优化,它不再需要一个详细的表达式状态创建元素显示或隐藏. 例如:我们在ng1.3之前的版本都需要如下写法: <div class="er ...

  6. 让 select 的 option 标签支持事件监听（如复制操作）

    这标题,让option支持事件监听,应该不难的呀,有什么好讲的? 其实还是有的,默认在浏览器代码是无法直接对option标签进行操作的,不仅包括JS事件监听,还是CSS样式设置 查了一些资料,姑且认为 ...

  7. 了解HTML表单之13个表单控件

    目录 传统控件 button select option optgroup textarea fieldset legend label 新增控件 datalist keygen output pro ...

  8. React 点击按钮显示div与隐藏div，并给div传children

    最近做了一个react的点击按钮显示与隐藏div的一个小组件: [筛选]组件FilterButton import React,{Component} from 'react'; import {re ...

  9. css之属性及剩余的选择符

    今天的课程加速了,比平时快了些,但觉得很不错.nice~ 属性选择符 E[att]       选择具有att属性的E元素. input[type]{color: #red;} <input t ...

随机推荐

  1. 51Nod：活动安排问题之二（贪心）

    有若干个活动,第i个开始时间和结束时间是[Si,fi),同一个教室安排的活动之间不能交叠,求要安排所有活动,最少需要几个室? 输入 第一行一个正整数n (n <= 10000)代表活动的个数. ...

  2. 10款PHP开源网店系统

    在当今经济危机的大环境下,网上购物越来越来吃香,网上开店成本低,快捷方便,出名的电子商务网站有淘宝,拍拍,Ebay或是最新的百度有啊,这些网站都提供开店的机会,如果是想自己搭建购物平台,可以从下面选择 ...

  3. 《DSP using MATLAB》 Problem 3.19

    先求模拟信号经过采样后,对应的数字角频率: 明显看出,第3种采样出现假频了.DTFT是以2π为周期的,所以假频出现在10π-2kπ=0处. 代码: %% ----------------------- ...

  4. http协议详谈

    scheme - 定义因特网服务的类型.最常见的类型是 httphost - 定义域主机(http 的默认主机是 www)domain - 定义因特网域名,比如 runoob.comport - 定义 ...

  5. statik golang 静态资源嵌入二进制文件工具使用（docker 构建)

      将静态资源打包进二进制文件有好多方便的地方 方便客户演示 代码简单加密 运行方便 statik 就是一款在golang 中用的比较多,nodejs 有一款pkg (oclif 就推荐使用此工具) ...

  6. juc包下的集合类

    import java.util.Iterator;import java.util.concurrent.CopyOnWriteArrayList; /** * 集合在多线程中同步的方式: * 1. ...

  7. PIG之 Hadoop 2.7.4 + pig-0.17.0 安装

    首先: 参考 http://blog.csdn.net/zhang123456456/article/details/77621487 搭建好hadoop集群. 然后,在master节点安装pig. ...

  8. SQL SERVER 2008 彻底卸载干净方法 （转）

    最近安装SQL SERVER 2008失败后,再重新安装时老是报错,东搞西搞的很难卸干净.但又不方便重装系统,经按下面方法终于搞定并成功安装上2008 1.停掉SQL SERVER 2008所有相关服 ...

  9. hanlp中文自然语言处理的几种分词方法

    自然语言处理在大数据以及近年来大火的人工智能方面都有着非同寻常的意义.那么,什么是自然语言处理呢?在没有接触到大数据这方面的时候,也只是以前在学习计算机方面知识时听说过自然语言处理.书本上对于自然语言 ...

  10. C/C++基础----表达式

    1 基本概念 类型转换,小整型通常会被提升. 运算符重载,运算对象的个数.运算符的优先级和结合律都是无法改变的. 左值右值,对象被用做右值时,使用的是对象的值(内容):用做左值时,使用的是对象的身份( ...