wiki:jazz/08-10-18/jQuery

2008-10-18

[目標] 使用 jQuery UI 的 datepicker 實作挑選日期的元件

  • [參考] ​<jQuery筆記> 好用的日期函式 datepicker
    • 下載 jQuery UI Theme - ​http://ui.jquery.com/themeroller 
      jazz@sensor:/var/www$ sudo wget -O jquery-ui-themeroller.zip "http://ui.jquery.com/applications/themeroller/download.php?href=/applications/themeroller/css/jquery-ui-base.css.php?ctl=themeroller"
jazz@sensor:/var/www$ sudo unzip jquery-ui-themeroller.zip
jazz@sensor:/var/www$
    • 編輯範例程式: 
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
                    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script src="http://dev.jquery.com/view/tags/ui/latest/ui/ui.datepicker.js"></script>
  <style type="text/css" media="screen">
    @import url('jquery-ui-themeroller.css');
    img.datepicker_trigger{ border:none; }
  </style>
  <script>
  $(document).ready(function(){
    $('#example').datepicker({dateFormat: 'yy-mm-dd'});
  });
  </script>
</head>
<body>
<input type="text" id="example"/>
</body>
</html>

[目標] 使用 jQuery File Upload Plugin 達成檔案上傳目的!'''

  • 使用 jQuery 當然就要先取得 javascript 檔案囉~
    • 第一種方法:下載 jQuery 的 js 檔 - ​1.2.6 版
    • 第二種方法:直接嵌入 jQuery 官方或 Google AJAX API 維護的網址 ​詳細清單 
      <script src="http://code.jquery.com/jquery-latest.js"></script>

      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
    • 第三種方法:使用 Google AJAX API 的語法 - 先決條件是先取得 Google API Key 
      google.load("jquery", "1.2.6");
Last modified 16 years ago Last modified on Oct 19, 2008, 12:23:22 AM