控件组合的水平布局

select + input 在同一行

注意jquery mobile 的js 和css 的版本，

一些低版本 估计不支持

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css" />
  5.     <script  type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
  6.     <script  type="text/javascript" src="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.js"></script>
  7. <style id="textinput-controlgroup">
  8.             .controlgroup-textinput{
  9.                 padding-top:.22em;
  10.                 padding-bottom:.22em;
  11.             }
  12.         </style>
  13. </head>
  14. <body>
  15.  
  16. <div data-role="page">
  17.   <div data-role="header">
  18.     <h1>Welcome To My Homepage</h1>
  19.   </div>
  20.  
  21.   <div data-role="content">
  22.     <label>title</label>
  23.  
  24. <div data-role="controlgroup" data-type="horizontal">
  25.     <select>
  26.         <option>1</option>
  27.     </select>
  28.     <input id="currency-controlgroup"
  29. type="text" data-wrapper-class="controlgroup-textinput ui-btn">
  30.  
  31. </div>
  32.  
  33.   </div>
  34.  
  35.   <div data-role="footer">
  36.     <h1>Footer Text</h1>
  37.  
  38.   </div>
  39. </div> 
  40.  
  41. </body>
  42. </html>

jquery mobile - select and input - horizontal - in same line的更多相关文章

  1. jquery仿jquery mobile的select控件效果

    不说废话.直接上代码 //仿jQuery mobile Select控件 //使用方法box为容器id,_id指控件id,selectvalue为选中值,Value为当前值 function Sele ...

  2. jQuery还原select下拉列表和清空input的值,回显下拉列表框的值

    实现用jQuery还原select下拉列表的值,用了很多种方式,花了一些时间,最后重要找到一种可以实现的方式, 页面上有这些内容 <select id ="level" na ...

  3. JQuery Mobile - 动态修改select选择框的选中项

    <label for="day">选择天</label> <select name="day" id="day" ...

  4. Jquery Mobile 小结

    第一次做一个移动站点,当时纠结选Jquery Mobile还是Zepto,Zepto相对于JM更加轻巧,语法上面也很相似,但考虑到时间问题和JM自带了很多组件(Bootstrap惯出来的),还是选择了 ...

  5. jQuery Mobile动态刷新页面样式

    当我们使用Ajax或者javascript动态在页面上添加元素后,如添加select控件的option元素,添加ul的li元素.添加之后我们会发现,它们显示的样式不是jQuery Mobile的炫酷样 ...

  6. 【初探移动前端开发05】jQuery Mobile (整合版)

    前言 为了方便大家看的方便,我这里将这几天的东西整合一下发出. 里面的例子请使用手机浏览器查看. 什么是jQuery Mobile? jquery mobile是jquery在移动设备上的版本,他是基 ...

  7. 【初探移动前端开发04】jQuery Mobile (中)

    前言 昨天我们一起学习了一部分jquery mobile的知识,今天我们继续. 这些是些很基础的东西,有朋友觉得这个没有其它的好,但是学习下不吃亏嘛,我反正也不会一起学习基础啦. 例子请使用手机查看哦 ...

  8. 使用jQuery Mobile的注意事项（译）

    翻译编辑自:http://www.appnovation.com/blog/7-things-know-about-jquery-mobile-working-it 一.Android和IOS的内置键 ...

  9. jQuery Mobile Data 属性

    按钮 带有 data-role="button" 的超链接.button 元素.工具栏中的链接以及 input 字段都会自动渲染成按钮样式,不需要添加 data-role=&quo ...

随机推荐

  1. 二维码的生成细节和原理 -- 转http://news.cnblogs.com/n/191671/

    二维码又称 QR Code,QR 全称 Quick Response,是一个近几年来移动设备上超流行的一种编码方式,它比传统的 Bar Code 条形码能存更多的信息,也能表示更多的数据类型:比如:字 ...

  2. 2 plan team 服务器搭建

    最近想搞个2-plan team看看,是不是适合小型团队任务管理 下了个包,解压了,发现里面的readme太简单了 readme中的install相关的内容如下 ### Installation in ...

  3. Python如何打包EXE可执行文件

    一.安装Pyinstaller 使用Python打包EXE可执行文件时,需要使用Pyinstaller,使用命令pip install PyInstaller进行安装,如下图: 安装成功后的效果如下图 ...

  4. C# Linq及Lamda表达式实战应用之 GroupBy 分组统计

    在项目中做统计图表的时候,需要对查询出来的列表数据进行分组统计,首先想到的是避免频繁去操作数据库可以使用 Linq eg: //例如对列表中的Cu元素进行按年GroupBy分组统计 //包含年份,平均 ...

  5. 重新排序文本文件(txt)里面的内容

    近段时间,Insus.NET学习练习物件与对象,怎样创建实际环境中的对象.对读取文本文件以及分析文本文件作为目标.因此搜索论坛一些例子,就如下面这题,实现的方法分享给大家. 以文本行作为一个对象,所以 ...

  6. 十天入门java教程 Day02

    1,常量,变量的理解 常量,程序运行过程中,不能改变的,叫常量. 变量,程序运行过程中,改变的,叫变量. 2,变量的理解 变量,用来存储数据的,数据类型,存放哪种数据的种类. 变量的概念:程序运行期间 ...

  7. WP8.1&UWP手机设备对状态栏操作

    改UWP和WP8.1手机设备的状态栏.首先先说较为普遍的WP8.1设备:首先添加引用:using Windows.UI.ViewManagement;其次就可以使用StatusBar了,它提供了以下方 ...

  8. MySQL数据库之插入显示图片

    图书馆系统项目需要用到好多图片,并且要求存入到数据库中,对这个特别感兴趣,于是上网查了资料,采用C#语言,进行了具体实现. 说明: 功能:往MySQL数据库插入并显示图片: 验证:执行插入功能后,我把 ...

  9. Linux之NFS网络文件系统

    NFS(Network File System)即网络文件系统,是FreeBSD支持的文件系统中的一种,它允许网络中的计算机之间通过TCP/IP网络资源共享.在NFS的应用中,本地NFS的客户端应用可 ...

  10. 亿级PV请求的三种负载均衡技术（转）

    http://www.360doc.com/content/17/1126/23/50145453_707419125.shtml       目录 DNS轮询 LVS负载均衡 DR模式 NAT模式 ...