跨浏览器兼容HTML5 Placeholder演示页面

代码:

HTML代码:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script src="jquery.placeholder.js"></script>
<form action="">
    <p>
        <input type="text" placeholder="username" name="username">
    </p>
    <p>
        <input type="password" placeholder="password" name="password">
    </p>
    <p>
        <textarea placeholder="A textarea placeholder" name="text"></textarea>
    </p>
    <p>
        <button type="submit">Submit</button>
    </p>
</form>
<script>
    $('input[placeholder], textarea[placeholder]').placeholder();
</script>
					
CSS代码:

input, textarea {
    padding:4px; width:225px; font-family: arial, sans-serif; font-size: 12px;
}
textarea {
    width: 425px; height: 200px;
}
.placeholder {
    color: #aaa;
}
					

效果:

回到相关文章 »