所要的需求就是網頁上有個input欄位,類似那種搜尋框吧
然後希望點按到搜尋框時,預設的文字可以消失。
使用jQuery的方法:
優: 適用於不支援html5的瀏覽器(IE8以上).
缺: 必須先匯入jquery.
在IE必須先允許執行ActiveX控制項.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>搜尋框預設文字+點按後預設字消失</title>
<script src="http://code.jquery.com/jquery-latest.js"></script> <!--匯入jquery是必要項目-->
<style>
#target {color: #666;}
button{background: #555;coloR: #fff;}
</style>
<script type="text/javascript">
$(function(){
$('#target').click(function() {
//$(this).val("");
$('input[name="target"]').val("");
});
});
</script>
</head>
<body>
<form>
<input id="target" name="target" type="text" value="type something" /> <button>search!</button>
</form>
</body>
</html>
使用HTML5方式 :
優: 不需額外匯入jquery.
缺: 只能在可以使用HTML5的瀏覽器.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>搜尋框預設文字+點按後預設字消失</title>
<style>
#target {color: #666;}
button{background: #555;coloR: #fff;}
</style>
</head>
<body>
<form>
<input id="target" name="target" type="text" placeholder="type something" /> <button>search!</button>
</form>
</body>
</html>
相信此時妳已知jquery也可用http://fuelyourcoding.com/scripts/infield/ 外掛來做到
回覆刪除對呀 感謝大師指導 謝謝:DDDDDD
刪除