<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" type="text/css" href="css/style.css" />
<script src="./OSS/jquery-1.11.1.js"></script>
<script src="./plugin/emailfield.js"></script>
<script src="./plugin/emailPlugin.js"></script>
<script type="text/javascript">
$(function() {
$(".email").emailPlugin({
‘height‘: ‘40px‘,
‘width‘: ‘400px‘,
‘watermark‘: ‘To:‘
});
})
</script>
</head>
<body>
<div class="email">
</div>
</body>
</html>
1 /**
2 * Created by Administrator on 14-10-26.
3 */
4 /**
5 * Created by Administrator on 14-10-25.
6 */
7 ;(function($, window, document,undefined) {
8 var Emailfield = function(ele, opt){
9 this._element = ele,
10
11 this.defaults ={
12 ‘height‘:‘30px‘,
13 ‘width‘:‘200px‘,
14 ‘bkcolor‘:‘#FF9900‘,
15 ‘watermark‘:‘xx‘
16 },
17
18 this.options = $.extend({}, this.defaults, opt);
19 }
20
21 Emailfield.prototype.init = function(){
22 Emailfield._setStyle(this._element, this.options);
23 //Emailfield._createInput(this._element, this.options);
24
25 //return this.$element.css(‘height‘, ‘50px‘);
26 //alert("init");
27 };
28
29 Emailfield.prototype._setWaterMark = function (){
30 alert("_setWaterMark");
31 };
32
33 Emailfield._setStyle = function(ele,opt){
34 ele.css("height", opt.height);
35 ele.css("width", opt.width);
36 ele.css("background-color", opt.bkcolor);
37 ele.one("click",function(){
38 Emailfield._createInput(this, opt);
39 });
40 //ele.addClass("emailinit");
41 //this.prototype._setWaterMark();
42 };
43
44 Emailfield._createInput = function(ele, opt){
45 var input = $("<input type =‘text‘>");
46 var h = opt.height-2;
47 input.css("height", opt.height-2);
48 input.css("width", opt.width-20);
49 input.appendTo(ele);
50 };
51
52 $.fn.emailPlugin = function(options){
53 // chain jQuery functions
54 var e = new Emailfield(this,options);
55 return e.init();
56 };
57
58 })(jQuery);
时间： 2024-10-13 21:04:22