Java基礎—Java方法的呼叫
阿新 • • 發佈:2020-11-21
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="jquery-1.11.3/jquery.min.js"></script> <script> $(function(){ var $lis = $("ul li"); var $btn = $("#btn1"); var $text = $("#txt1"); var $div = $("div"); // 新增點選事件 $lis.click(function(){ // 獲取當前點選的標籤物件 // 原生js的寫法 // this.style.color = "red";// jquery寫法 $(this).css({"color":"red"}); // 獲取點選標籤的索引 alert($(this).index()) }); $btn.click(function(){ // 獲取文字框的內容 alert($text.val()); }); // 給text文字框新增獲取焦點事件 $text.focus(function(){ // 獲取得到焦點的文字框,然後設定樣式屬性 $(this).css({"background":"red"}); }); // 給text文字框新增失去焦點事件 $text.blur(function(){ $(this).css({"background":"white"}); }); // 給div設定滑鼠懸停(進入)事件 $div.mouseover(function(){ $(this).css({"background":"green"}); }); // 給div設定滑鼠離開事件 $div.mouseout(function(){ $(this).css({"background":"white"}); }); }); </script> </head> <body> <div> <ul> <li>蘋果</li> <li>鴨梨</li> <li>香蕉</li> </ul> <input type="text" id="txt1"> <input type="button" id="btn1" value="你點我"> </div> </body> </html>