jquery 的滑鼠事件/淡入淡出/繫結
阿新 • • 發佈:2018-12-05
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jquery的學習</title>
<!-- 引入第三方庫用單表籤 -->
<script type="text/javascript" src="./js/jquery.min.js"></script>
<script type="text/javascript">
/* jquery 程式碼的入口,用來等待元素的全部載入*/
// $(function() {
// /* 用jQuery選擇器來選取某一個div 的內容*/
// /*var宣告一個變數*/
// alert($("#c2").html());
// });
$(function(){ var content =jQuery("#c2").html();
var content1 =$(".c2").val();
alert(content1);
// jquery 繫結點選事件
// $("#b3").click(function(){ // // 隱藏div -----淡出時間
// // $("#c2").hide(3000);
// $("#c2").fadeOut(3000);
// });
// $("#b2").click(function(){
// 淡入
// $("#c2").fadeIn(3000);
// });
$("#b2").click(function(){ $("#c2").fadeToggle(3000);
});
});
</script>
</head>
<body>
<div id="c2"> 123123123 </div>
<!-- 文字框 -->
<input class=" c2" type=" text" width = "400" value= "中國"/>
<!-- <input id="b3" type="button" value=" 淡出"/>
<input id="b2" type="button" value=" 淡入"/> -->
<input id="b2" type="button" value=" 開始"/>
</body>
</html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jquery的學習</title>
<!-- 引入第三方庫用單表籤 -->
<script type="text/javascript" src="./js/jquery.min.js"></script>
<script type="text/javascript">
/* jquery 程式碼的入口,用來等待元素的全部載入*/
// $(function() {
// /* 用jQuery選擇器來選取某一個div 的內容*/
// /*var宣告一個變數*/
// alert($("#c2").html());
// });
$(function(){ var content =jQuery("#c2").html();
var content1 =$(".c2").val();
alert(content1);
// jquery 繫結點選事件
// $("#b3").click(function(){ // // 隱藏div -----淡出時間
// // $("#c2").hide(3000);
// $("#c2").fadeOut(3000);
// });
// $("#b2").click(function(){
// 淡入
// $("#c2").fadeIn(3000);
// });
$("#b2").click(function(){ $("#c2").fadeToggle(3000);
});
});
</script>
</head>
<body>
<div id="c2"> 123123123 </div>
<!-- 文字框 -->
<input class=" c2" type=" text" width = "400" value= "中國"/>
<!-- <input id="b3" type="button" value=" 淡出"/>
<input id="b2" type="button" value=" 淡入"/> -->
<input id="b2" type="button" value=" 開始"/>
</body>
</html>