baoxiudan.html
3.2 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>我的报修单</title>
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<link rel="stylesheet" type="text/css" href="css/mui.min.css" />
<link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_537174_a4y4ri5v8z6t7qfr.css"/>
<link rel="stylesheet" type="text/css" href="css/swiper.min.css"/>
<link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_550254_r6pua542e96vquxr.css"/>
<link rel="stylesheet" type="text/css" media="screen" href="css/base.css" />
<script src="js/base.js"></script>
</head>
<body>
<div class="container baoxiu_container">
<div class="baoxiu_form_items">
<div class="baoxiu_form_item">
联系人：
<input type="text" name="name" class="form_input_box" id="name" placeholder="请输入联系人姓名" />
</div>
<div class="baoxiu_form_item">
电话：
<input type="text" name="name" class="form_input_box" id="phone" placeholder="请输入联系人姓名" />
</div>
<div class="baoxiu_form_item">
故障：
<div class="form_input_box">
<div class="mui-input-row mui-radio ">
<input name="checkbox" value="Item 1" type="radio" checked>
<label>内屏碎</label>
</div>
<div class="mui-input-row mui-radio ">
<input name="checkbox" value="Item 1" type="radio" checked>
<label>外屏碎</label>
</div>
<div class="mui-input-row mui-radio ">
<input name="checkbox" value="Item 1" type="radio" checked>
<label>内外屏碎</label>
</div>
</div>
</div>
<div class="baoxiu_form_item upload_img">
上传照片：
<div class="upload_img_container">
<div class="upload_img_item">
<span class="iconfont icon-zhaopian"></span>
</div>
<div class="upload_img_item">
<span class="iconfont icon-zhaopian"></span>
</div>
<div class="upload_img_item">
<span class="iconfont icon-zhaopian"></span>
</div>
<div class="upload_img_item">
<span class="iconfont icon-zhaopian"></span>
</div>
</div>
<div class="upload_btn">上传</div>
</div>
</div>
</div>
<!--底部-->
<div class="nav_bottom make_sure" >
提交
</div>
<script type="text/javascript" src="js/jquery-2.1.0.js"></script>
<script type="text/javascript" src="js/mui.min.js"></script>
<script type="text/javascript" src="js/swiper.min.js" ></script>
<script>
//提交操作
mui('body').on('tap','.make_sure',function(){
var name = $('#name').val();
var phone = $('#phone').val();
var photoUrl = [];
if(name==''||typeof name == 'undefined'){
mui.toast('联系人不能为空');
return false;
}
var reg = /^1[3|4|5|7|8][0-9]{9}$/;
if(!reg.test(phone)){
mui.toast('手机号码格式不正确')
return false;
}
if(photoUrl.length<1){
mui.toast('图片不能为空');
return false;
}
var params = {
name:name,
phone: phone,
imgurl: photoUrl.join()
}
})
</script>
</body>
</html>