easyui 格式化日期以及國際化的引用
阿新 • • 發佈:2019-01-30
easyui預設的語言是英文模式,但同時引入了國際化,也就是說我們在使用easyui時需要多引用一個國際化的JS。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Custom Calendar - jQuery EasyUI Demo</title> <link rel="stylesheet" type="text/css" href="../../themes/default/easyui.css" /> <link rel="stylesheet" type="text/css" href="../../themes/icon.css" /> <link rel="stylesheet" type="text/css" href="../demo.css"/> <script type="text/javascript" src="../../jquery.min.js"></script> <script type="text/javascript" src="../../jquery.easyui.min.js"></script> <!-- 引入國際化中的JS --> <script type="text/javascript" src="../../locale/easyui-lang-zh_CN.js"></script> </head> <body> <h2>Custom Calendar</h2> <p>這個樣例主要關於格式化easyui的日曆。</p> <div style="margin: 20px 0;"></div> <div class="easyui-calendar" style="width: 250px;height: 250px;" data-options="formatter:formatDay"></div> <script> //獲取隨機數 var d1 = Math.floor((Math.random()*30)+1); var d2 = Math.floor((Math.random()*30)+1); //格式化日曆中的每一天 function formatDay(date){ var m = date.getMonth()+1; var d = date.getDate(); var opts = $(this).calendar('options'); if (opts.month ==m && d ==d1){ return '<div class="icon-ok md">' + d + '</div>'; } else if (opts.month == m && d== d2){ return '<div class="icon-search md">'+ d +'</div>' } //alert(d); return d; } </script> <style scoped="scoped"> .md{ height:16px; line-height:16px; background-position:2px center; text-align:right; font-weight:bold; padding:0 2px; color:red; } </style> </body> </html>