开关
按钮类型有两类，一类是a标签的方式，一类是button的方式，目前我们按钮采用的是a标签方式
<input type="checkbox" data-role="flipswitch" name="flip-checkbox" data-on-text="开" data-off-text="" id="f2"/>
<input type="checkbox" data-role="flipswitch" name="flip-checkbox" data-on-text="开" data-off-text="关"/>
<input type="checkbox" data-role="flipswitch" name="flip-checkbox" data-on-text="开" data-off-text="关" checked="checked"/>
<input type="checkbox" data-role="flipswitch" name="flip-checkbox" disabled="disabled" data-on-text="开" data-off-text="关" checked="checked"/>
开关使用说明
开关采用input[type="checkbox"]形式，默认是关，要设置默认打开许要添加属性checked="checked"
开关禁用需加上disabled='disabled'
单选
参加
不参加
待定
<div class="ui-grid-b users_select comp" comp="type:'radio',inputId:'receipt_select_value'">
<div class="ui-block-a margin_tb_5">
<div class="iphone_radio">
<span class="feedbackradio ico_phone_radio_checked30 margin_r_5" radio_value="1"></span>
<span class="ico_phone_48 attend_meeting_48"></span>
参加
</div>
</div>
<div class="ui-block-b margin_tb_5">
<div class="iphone_radio">
<span class="feedbackradio ico_phone_radio30 margin_r_5" radio_value="0"></span>
<span class="ico_phone_48 unattended_meeting_48"></span>
不参加
</div>
</div>
<div class="ui-block-c margin_tb_5">
<div class="iphone_radio">
<span class="feedbackradio ico_phone_radio30 margin_r_5" radio_value="-1"></span>
<span class="ico_phone_48 unsure_48"></span>
待定
</div>
</div>
<input type="hidden" value="1" id="receipt_select_value"/>
</div>
单选使用说明
单选外层父级需要添加公共组件属性comp，inputId对应的值为单选所选取值的id
多选
<label for="checkbox-v-2a">选项一</label>
<input type="checkbox" name="checkbox-v-2a" id="checkbox-v-2a" value="2a"/>
<label for="checkbox-v-2b">选项二</label>
<input type="checkbox" name="checkbox-v-2b" id="checkbox-v-2b" value="2b" checked="checked"/>
<label for="checkbox-v-2c">选项三</label>
<input type="checkbox" name="checkbox-v-2c" id="checkbox-v-2c" value="2c" disabled="disabled" checked="checked"/>
单选使用说明
单选外层父级需要添加公共组件属性comp，inputId对应的值为单选所选取值的id
页头
会议
会议详情
回执
<header data-role="header" class="page_header">
<h1 class="page_header_title">
会议
<span></span>
</h1>
</header>
<header data-role="header" class="page_header">
<h1 class="page_header_title">
会议详情
<span></span>
</h1>
<a href="#" class="ui-btn ui-btn-inline ui-btn-icon-top ui-btn-icon-b ui-icon-return"></a>
<a href="#" class="ui-btn ui-btn-inline ui-btn-a">回执</a>
</header>
单选使用说明
单选外层父级需要添加公共组件属性comp，inputId对应的值为单选所选取值的id
选项卡
<div class="comp" comp="type:'tabs'">
<div data-role="navbar">
<ul class="model_header_tabs">
<li><a href="#" class="tab-ui-btn-a ui-btn-active" tgt="tabs1">选项卡一</a></li>
<li><a href="#" class="tab-ui-btn-a" tgt="tabs2">选项卡二</a></li>
</ul>
</div>
<div class="tabs_body">
<div class="ele_active" id="tabs1">
<h4>内容区域一</h4>
</div>
<div class="ele_hide" id="tabs2">
<h4>内容区域二</h4>
</div>
</div>
</div>
<div class="comp" comp="type:'tabs'">
<div data-role="navbar" class="navbar_add_icon">
<ul>
<li>
<a href="#" class="tab-ui-btn-a ui-btn-active" tgt="tabs3">
<span class="ico_phone_48 attend_meeting_48"></span>
参加
<span class="ico_phone_22 drop_up_btn_22 margin_l_20"></span>
</a>
</li>
<li>
<a href="#" class="tab-ui-btn-a" tgt="tabs4">
<span class="ico_phone_48 accessory_48"></span>
(<label>10</label>)
</a>
</li>
</ul>
</div>
<div class="tabs_body">
<div class="ele_active" id="tabs3">
<h4>内容区域三</h4>
</div>
<div class="ele_hide" id="tabs4">
<h4>内容区域四</h4>
</div>
</div>
</div>
选项卡使用说明
由于多页面切换含有data-tabs="tabs"的时候，iphone端页面会存在一定问题，所以不用jqm原生选项卡，在多页面使用的时候采用自定义的选项卡！
comp="type:'tabs'"，表示模拟tabs切换，tgt的属性值为需要显示的区域块的id
附件
-
500MB
-
500MB
-
500MB
-
500MB
<ul class="receipt_accessory_type padding_10">
<li>
<div class="accessory_underway margin_tb_10">
<div class="accessory_underway_content">
<div class="accessory_icon padding_lr_10">
<span class="ico_phone_48 mp4_48 "></span>
</div>
<div class="accessory_name">
<p class="receipt_accessory_content">
<label>致远十年致远十年致远十年致远十年致远十年致远十年致远十年致远十年</label>
<label>.DVD</label>
</p>
<p class="underway_accessory_size">500MB</p>
</div>
</div>
<p class="accessory_underway_bar"></p>
<span class="ico_phone_48 cancel_upload_48 model_info_close"></span>
</div>
</li>
<li>
<div class="accessory_fail margin_tb_15">
<div class="accessory_icon padding_lr_10">
<span class="ico_phone_48 mp4_48 "></span>
</div>
<div class="accessory_name">
<p class="receipt_accessory_content">
<label>致远十年致远十年致远十年致远十年致远十年致远十年致远十年致远十年</label>
<label>.DVD</label>
</p>
<p class="underway_accessory_size">500MB</p>
</div>
<span class="ico_phone_48 anew_upload_48 model_info_close"></span>
</div>
</li>
<li>
<div class="accessory_finish margin_tb_15">
<div class="accessory_icon padding_lr_10">
<span class="ico_phone_48 mp4_48 "></span>
</div>
<div class="accessory_name">
<p class="receipt_accessory_content">
<label>致远十年致远十年致远十年致远十年致远十年致远十年致远十年致远十年</label>
<label>.DVD</label>
</p>
<p class="accessory_size">500MB</p>
</div>
<span class="ico_phone_48 cancel_upload_48 model_info_close"></span>
</div>
</li>
<li>
<div class="accessory_finish margin_tb_15">
<div class="accessory_icon padding_lr_10">
<span class="ico_phone_48 mp4_48 "></span>
</div>
<div class="accessory_name">
<p class="receipt_accessory_content">
<label>致远十年致远十年致远十年致远十年致远十年致远十年致远十年致远十年</label>
<label>.DVD</label>
</p>
<p class="accessory_size">500MB</p>
</div>
<div class="accessory_icon padding_lr_10">
<span class="ico_phone_48 accessory_download_48 "></span>
</div>
</div>
</li>
</ul>
会议头部
内容内容内容内容内容内容内容内容内容内容内容内容内容内容
内容内容内容内容内容内容内容内容内容内容内容内容内容内容
内容内容内容内容内容内容内容内容内容内容内容内容内容内容
内容内容内容内容内容内容内容内容内容内容内容内容内容内容
卜宏宇
<div class="content_header">
<div class="content_header_title">
<div>内容内容内容内容</div>
<div>
<span class="right ico_phone_22 accessory_22 content_header_icon"></span>
</div>
</div>
<div class="content_manager_time clearFlow">
<span class="content_header_time">
<label class="padding_r_5">今天</label>
<label>10:30-11:30</label>
</span>
<span class="content_header_name">卜宏宇</span>
</div>
</div>
会议内容
本期将和大家一起分享高效能人士七个习惯中的首要习惯——“积极主动”的相关内容。有这样一个事实
<div class="content">
<p>本期将和大家一起分享高效能人士七个习惯中的首要习惯——“积极主动”的相关内容。有这样一个事实</p>
</div>
会议列表
<div class="content_list">
<div>
会议时间：<label class="padding_r_5">11-13</label><label>17:00-17:30</label>
</div>
<div class="content_participants">
<a href="#" data-transition="slide" data-prefetch="true">
<span class="content_participants_p">与会人员：<label>王未、单燕</label></span>
</a>
<span class="right ico_phone_48 spread_right_48"></span>
</div>
<div>会议地点：<label>第一会议室105</label></div>
<div>主持人：<label>张小二</label></div>
<div>主持人：<label>张小二</label></div>
</div>
意见回复
<div data-role="collapsible" data-collapsed="false" data-iconpos="right" data-inset="false"
class="content_reply iphone_bg" >
<h4 class="content_reply_title">回复意见(<label>12</label>)</h4>
<ul>
<li>
<div class="content_reply_content">
<div class="first_content_reply padding_t_10 padding_b_5">
<div class="user_head">
<img src="../../../../skin/cmp/iphone/images/idea_user.png" />
</div>
<div class="content_reply_info">
<p class="reply_person_info">
<label>赵康永</label>
<label class="padding_l_10">已阅</label>
</p>
<p class="reply_person_content padding_t_5">
智能手机终端不仅是一个信息提供息的接收设备，而且也是系统。
</p>
<ul class="receipt_accessory_type margin_r_40">
<li>
<div class="accessory_finish margin_tb_15">
<div class="accessory_icon padding_lr_10">
<span class="ico_phone_48 mp4_48 "></span>
</div>
<div class="accessory_name">
<p class="receipt_accessory_content">
<label>致远十年致远十年致远十年致远十年致远十年致远十年致远十年致远十年</label>
<label>.DVD</label>
</p>
<p class="accessory_size">500MB</p>
</div>
<div class="accessory_icon padding_lr_10">
<span class="ico_phone_48 accessory_download_48 "></span>
</div>
</div>
</li>
</ul>
<div class="send_type">
<span class="padding_r_5">
2012-07-19 13:33
</span>
发自
<span class="clientType">
Android
</span>
客户端
<a href="#" class="ui-btn ui-btn-inline ui-btn-icon-top ui-btn-icon-b ui-icon-reply reply_btn"></a>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>
2、震荡回复
<div data-role="collapsible" data-collapsed="false" data-iconpos="right" data-inset="false"
class="content_reply iphone_bg" >
<h4 class="content_reply_title">回复意见(<label>12</label>)</h4>
<ul>
<li>
<div class="content_reply_content">
<div class="first_content_reply padding_t_10 padding_b_5">
<div class="user_head">
<img src="../../../../skin/cmp/iphone/images/idea_user.png" />
</div>
<div class="content_reply_info">
<p class="reply_person_info">
<label>赵康永</label>
<label class="padding_l_10">已阅</label>
</p>
<p class="reply_person_content padding_t_5">
智能手机终端不仅是一个信息提供息的接收设备，而且也是系统。
</p>
<ul class="receipt_accessory_type margin_r_40">
<li>
<div class="accessory_finish margin_tb_15">
<div class="accessory_icon padding_lr_10">
<span class="ico_phone_48 mp4_48 "></span>
</div>
<div class="accessory_name">
<p class="receipt_accessory_content">
<label>致远十年致远十年致远十年致远十年致远十年致远十年致远十年致远十年</label>
<label>.DVD</label>
</p>
<p class="accessory_size">500MB</p>
</div>
<div class="accessory_icon padding_lr_10">
<span class="ico_phone_48 accessory_download_48 "></span>
</div>
</div>
</li>
</ul>
<div class="send_type">
<span class="padding_r_5">
2012-07-19 13:33
</span>
发自
<span class="clientType">
Android
</span>
客户端
<a href="#" class="ui-btn ui-btn-inline ui-btn-icon-top ui-btn-icon-b ui-icon-reply reply_btn"></a>
</div>
</div>
</div>
<div class="user_reply_content">
<div class="user_reply_list">
<div class="user_head">
<img src="../../../../skin/cmp/iphone/images/idea_user.png" />
</div>
<div class="content_reply_info">
<p class="reply_person_info">
<label>张大伟</label>
</p>
<p class="reply_person_content padding_t_5">
智能手机终端不仅是1个。
</p>
<ul class="receipt_accessory_type margin_r_40">
<li>
<div class="accessory_finish margin_tb_15">
<div class="accessory_icon padding_lr_10">
<span class="ico_phone_48 mp4_48 "></span>
</div>
<div class="accessory_name">
<p class="receipt_accessory_content">
<label>致远十年致远十年致远十年致远十年致远十年致远十年致远十年致远十年</label>
<label>.DVD</label>
</p>
<p class="accessory_size">500MB</p>
</div>
<div class="accessory_icon padding_lr_10">
<span class="ico_phone_48 accessory_download_48 "></span>
</div>
</div>
</li>
</ul>
<div class="user_reply_type">
<span class="padding_r_5">
2012-07-19 13:33
</span>
发自
<span class="clientType">Android</span>
客户端
</div>
</div>
</div>
</div>
</div>
</li>
</ul>
</div>