控件组合的水平布局

select + input 在同一行

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

一些低版本 估计不支持

<!DOCTYPE html>

<html>

<head>

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css" />

    <script  type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>

    <script  type="text/javascript" src="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.js"></script>

<style id="textinput-controlgroup">

            .controlgroup-textinput{

                padding-top:.22em;

                padding-bottom:.22em;

            }

        </style>

</head>

<body>

<div data-role="page">

  <div data-role="header">

    <h1>Welcome To My Homepage</h1>

  </div>

  <div data-role="content">

    <label>title</label>

<div data-role="controlgroup" data-type="horizontal">

    <select>

        <option>1</option>

    </select>

    <input id="currency-controlgroup"

type="text" data-wrapper-class="controlgroup-textinput ui-btn">

</div>

  </div>

  <div data-role="footer">

    <h1>Footer Text</h1>

  </div>

</div> 

</body>

</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. java全栈day02案例

    商场库存清单案例 A: 案例分析. * a:观察清单后,可将清单分解为三个部分(清单顶部.清单中部.清单底部) * b:清单顶部为固定的数据,直接打印即可 * c:清单中部为商品,为变化的数据,需要记 ...

  2. 小小c#算法题 - 7 - 堆排序 (Heap Sort)

    在讨论堆排序之前,我们先来讨论一下另外一种排序算法——插入排序.插入排序的逻辑相当简单,先遍历一遍数组找到最小值,然后将这个最小值跟第一个元素交换.然后遍历第一个元素之后的n-1个元素,得到这n-1个 ...

  3. c# 省市区联动

    http://www.matrixkey.com.cn/blog/article.asp?id=427 建议楼主去这里看看:http://pagetalks.com/2010/03/22/jquery ...

  4. EF中的MySql返回 DataTable公共类库

    public static class SqlHelper { /// <summary> /// EF SQL 语句返回 dataTable /// </summary> / ...

  5. 记一次成功部署kolla-ansible ocata版本过程

    1.安装的docker版本 [root@controller ~]# docker --versionDocker version 17.09.1-ce, build 19e2cf6 2.安装的ans ...

  6. 总结一下vue里一些小技巧

    官方里的我就不细说了,自个撸文档就成,下面是实践里常用的几个小技巧或者说是遇到的坑,若有错误望大家指正)1.当用a标签设置新窗口打开页面,设置url时,建议给href进行v-bind绑定,然后写相对路 ...

  7. equals和==的区别 （Java基础）

    1. == 是一个运算符.2.Equals则是string对象的方法,可以.(点)出来. 我们比较无非就是这两种 1.基本数据类型比较 2.引用对象比较 1.基本数据类型比较 ==和Equals都比较 ...

  8. p2p-如何拯救k8s镜像分发的阿喀琉斯之踵？

    K8s的出现为PaaS行业的发展打了一针兴奋剂,Docker+k8s的技术路线已经成为了容器云的主流.尤其针对大流量,大弹性的应用场景来说,k8s将其从繁杂的运维.部署工作中彻底拯救出来.然而事情往往 ...

  9. arcgis图片文件

  10. [TJOI2013]循环格 费用流 BZOJ3171

    题目背景 一个循环格就是一个矩阵,其中所有元素为箭头,指向相邻四个格子.每个元素有一个坐标(行,列),其中左上角元素坐标为(0,0).给定一个起始位(r,c),你可以沿着箭头方向在格子间行走.即:如果 ...