jQuery
ใช้ jQuery และ UI โดยไม่ต้องโหลดมาเก็บในเครื่อง
วัชรเมธน์ ศรีเนธิโรทัย
18/12/2552
ใช้ google cdn แทนไง include เข้ามาเลย
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/i18n/ui.datepicker-th.js"></script>
<link type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/redmond/jquery-ui.css" media="all" /> |
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/i18n/ui.datepicker-th.js"></script>
<link type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/redmond/jquery-ui.css" media="all" />
อย่างเช่นโค้ดนี้
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/i18n/ui.datepicker-th.js"></script>
<link type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/redmond/jquery-ui.css" media="all" />
<title>Untitled Document</title>
<script type="text/javascript">
$(document).ready(function(){
$('.datepicker').datepicker({
dateFormat: "dd/mm/yy",
beforeShow: function (input) {
var dt = $.datepicker.parseDate('dd/mm/yy', $(input).val() );
if (dt) {
dt.setYear(dt.getFullYear() - 543);
$(input).val($.datepicker.formatDate('dd/mm/yy', dt));
}
},
onClose: function(dateText, inst) {
var dt = $.datepicker.parseDate('dd/mm/yy', dateText);
dt.setYear(dt.getFullYear() + 543);
$(this).val($.datepicker.formatDate('dd/mm/yy', dt));
}
});
});
</script>
</head>
<body>
<input name="datepicker" type="text" class="datepicker" />
</body>
</html> |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/i18n/ui.datepicker-th.js"></script>
<link type="text/css" rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/redmond/jquery-ui.css" media="all" />
<title>Untitled Document</title>
<script type="text/javascript">
$(document).ready(function(){
$('.datepicker').datepicker({
dateFormat: "dd/mm/yy",
beforeShow: function (input) {
var dt = $.datepicker.parseDate('dd/mm/yy', $(input).val() );
if (dt) {
dt.setYear(dt.getFullYear() - 543);
$(input).val($.datepicker.formatDate('dd/mm/yy', dt));
}
},
onClose: function(dateText, inst) {
var dt = $.datepicker.parseDate('dd/mm/yy', dateText);
dt.setYear(dt.getFullYear() + 543);
$(this).val($.datepicker.formatDate('dd/mm/yy', dt));
}
});
});
</script>
</head>
<body>
<input name="datepicker" type="text" class="datepicker" />
</body>
</html>
ในโค้ดด้านบนนั้น แอบนำเสนอวิธีทำให้ datepicker ป้อนข้อมูลเป็นปี พ.ศ.
ขอบคุณเว็บ http://www.gayji.net/?p=290 ที่เขียนเสนอวิธีไว้
Like this:
Like Loading...
วัชรเมธน์ ชิษณุคุปต์ ศรีเนธิโรทัย
Programmer, Blogger
ชีวิตมันคือการเดินทางเพื่อค้นหาอะไรบางอย่าง และเพื่อค้นพบอะไรบางอย่าง สิ่งที่รู้แล้วจะได้บอกกล่าวให้คนข้างหลังได้ฟัง เพื่อเดินลุยเข้าไปในพงหนามอย่างเตรียมใจไว้แล้วว่าอาจจะต้องเจ็บ
cillout says:
19/12/2552 at 19/12/2552
มันจะทำให้ server เราทำงานมากมั๊ยครับ???
administrator says:
20/12/2552 at 20/12/2552
เซิฟเวอร์เราไม่ต้องทำงานเลย เซิฟเวอร์ของกูเกิลทำงานแทน เร็วและแรง
Thzaa.com says:
10/02/2553 at 10/02/2553
ฮ่าๆๆ
แล้วผมอยากได้แบบมาเก็บที่เครืองตัวเองล่ะครับ
เราต้องไปโหลดที่ไหนบ้่างครับ
ขอเ้ว้บสำหรับโหดลหน่อยดิครับ
administrator says:
10/02/2553 at 10/02/2553
http://www.jquery.com
http://www.jqueryui.com
nightangel says:
16/03/2553 at 16/03/2553
ผมเพิ่งเริ่มศึกษา jquery
อยากทราบว่า เวปที่มี content ของ jquery จะช้าไหมครับ
ถ้าเป็นแบบว่าเอา lib ลงไว้ในเครื่อง server เราเอง
administrator says:
16/03/2553 at 16/03/2553
ไม่ช้าครับผม เขาว่ากันว่า jQuery การทำงานเร็วกว่า javascript แบบเดิมๆ ถึง 700%
ยิ่งเก็บไว้ในเครื่องเราจะยิ่งเร็ว เพราะไม่้ต้องวิ่งไปเอามาจากโฮสต์ของกูเกิล ที่บทความนี้แนะนำเผื่อไว้บางทีบางคน ขี้เกียจเก็บโค้ดให้รกเซิฟเวอร์ของตัวเอง
walker says:
27/04/2553 at 27/04/2553
ขอบคุณครับ มีประโยชน์มากครับ
tuk007 says:
01/09/2553 at 01/09/2553
ผมเอา File jquery-ui.min.js มาวางที่ server
แล้วเกิดอาการค้างน่ะครับ คือมันจะอ่าน File นี้ได้บ้าง
ไม่ได้บ้าง แก้ไขยังไงดีครับ