当前位置 博文首页 > RunningOnMyWay的博客：H5+jq 父元素绑定事件 处理子元素所有的
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
<title>title</title>
<link rel="stylesheet" type="text/css" href="../../css/style.css" />
<script type="text/javascript" src="../../script/common/jquery-2.2.4.min.js"></script>
<style type="text/css">
* {
margin: 0;
padding: 0;
list-style: none;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}
html {
font-size: 14px;
}
header {
height: 40px;
width: 100%;
min-width: 320px;
background: #000;
text-align: center;
color: #fff;
font-size: 1.2rem;
line-height: 40px;
}
footer {
height: 52px;
width: 100%;
min-width: 320px;
background: #000;
text-align: center;
color: #fff;
font-size: 1.2rem;
duo line-height: 52px;
position: absolute;
bottom: 0;
}
#wrapper {
width: 100%;
min-width: 320px;
position: absolute;
left: 0;
top: 94px;
border-top: 4px solid #f1f1f1;
bottom: 0px;
overflow: hidden;
z-index: 1;
background-color: #eee;
/* 防止本机Windows上的触摸事件 */
-ms-touch-action: none;
/* 防止callout tap-hold和文本的选择 */
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
/* 防止文本调整取向变化对web应用程序很有用 */
-webkit-text-size-adjust: none;
-moz-text-size-adjust: none;
-ms-text-size-adjust: none;
-o-text-size-adjust: none;
text-size-adjust: none;
}
.pull-loading {
text-align: center;
height: 40px;
line-height: 40px;
display: flex;
align-items: center;
justify-content: center;
}
#scroller ul li {
padding: 0px;
border-bottom: solid 1px #eee;
background: #fff;
}
li.active {
background-color: #f5f4f4!important;
}
</style>
</head>
<body>
<div>
<table class="p1 " style="background-color: #fff;">
<tbody>
<tr>
<td class="p2 ">
<!-- <img alt="" class="" data-wwsrc="../../image/qita/u_toleft.png" src="../../image/qita/u_toleft.png" style="width: 22px;vertical-align: middle;margin-bottom: 5px;margin-left: 2px;" /> -->
</td>
<td class="p4 text-center "><span> <span class="p5">选择患者</span> </span>
</td>
<td class="p6 text-right"><span style="float:right;" onclick="closeFrame('userselect')">关闭</span></td>
</tr>
</tbody>
</table>
<p style="padding:8px 10px;margin-bottom: 0px; position: relative;background-color: #fff;"><input class="form-control text-center" placeholder="输入姓名或电话搜索" style="border-radius: 16px;border: 1px solid #e2e2e2;width: 100%;padding: 6px 0px;font-size: 14px;" type="text" value="" />
<!-- <span data-positionstyle="absolute" style=" top: 15px; right: 22px; "> 搜索</span> -->
</p>
<div style="background-color: #fff;">
<!-- <header>上拉加载，下拉刷新</header> -->
<div id="wrapper">
<div id="scroller">
<ul>
<li id="a">
<table style="width:100%;">
<tbody >
<tr style="border-bottom: 1px solid #eee;" tapmode="press" >
<td class="text-center" style="width:14%;padding:8px 0px;"><img alt="" class="" src="../../image/qita/u_toux1.jpg" style="width: 35px; border-radius: 50%;vertical-align: middle;" /></td>
<td style="width:35%;padding-left: 10px;"><span style=" color: #000;">李媛媛</span></td>
<td style="width:12%;padding:8px 0px;"><span>25</span>岁</td>
<td style="width:12%;padding:8px 0px;"><span>男</span></td>
<td style="width:30%;padding:8px 0px;"><span >16788888888</span></td>
</tr>
</tbody>
</table>
</li>
<li id="b">
<table style="width:100%;">
<tbody >
<tr style="border-bottom: 1px solid #eee;" tapmode="press" >
<td class="text-center" style="width:14%;padding:8px 0px;"><img alt="" class="" data-wwsrc="../../image/qita/u_toux1.jpg" src="../../image/qita/u_toux1.jpg" style="width: 35px; border-radius: 50%;vertical-align: middle;" /></td>
<td style="width:35%;padding-left: 10px;"><span style=" color: #000;">李媛媛</span></td>
<td style="width:12%;padding:8px 0px;"><span>25</span>岁</td>
<td style="width:12%;padding:8px 0px;"><span>男</span></td>
<td style="width:30%;padding:8px 0px;"><span >16788888888</span></td>
</tr>
</tbody>
</table>
</
