zoukankan      html  css  js  c++  java
  • Html+jquery mobile

    打开VS 2013,选择【文件】-【新建】-【项目】

    选择框架为.NET Framework4-【ASP.NET MVC4 Web应用程序】,点击【确定】

    选择【基本】,点击【确定】

    创建的MVC的项目显示如上图所示。

    引入jquery mobile组件

    首先下载jQuery Mobile http://jquerymobile.com/download/

    下载上述框中的包,然后进行解压如下所示

    将上图中红色框中的文件引入到项目中,显示如下:

    引入之后就能进行jquery mobile的开发了,可以右键controller-【新建】

    命名-【添加】

    然后在ActionResult Index右键-【添加视图】

    【添加】,在生成的视图中添加如下代码:

    上图中的红框部分是对jquery mobile的引用,非常关键,引入的顺序也十分关键。

    <!DOCTYPE html>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>WMS - Login</title>
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <link href="~/Css/jquery.mobile-1.4.5.css" rel="stylesheet" />
        <script src="~/Scripts/jquery-1.8.2.js"></script>
        <script src="~/Scripts/jquery.mobile-1.4.5.js"></script>
    </head>
    <body>
        <div data-role="page">
            <div data-role="header" data-theme="c">
                <h1>
                    WMS
                </h1>
            </div>
            <!-- /header -->
            <div role="main" class="ui-content">
                <h3>
                    Sign In
                </h3>
                <label for="userid">
                    User Id
                </label>
                <input type="text" id="userid" name="userid">
                <label for="password">
                    Password
                </label>
                <input type="password" name="password" id="password">
                <input type="button" id="login" value="Submit" role="button" />
            </div>
            <!-- /content -->
        </div>    
    </body>
    </html>

    然后运行程序,就能在浏览器中看到jquey mobile的效果了

    后续的程序的开发就和MVC网站的开发是相通的了。

  • 相关阅读:
    深入理解乐观锁与悲观锁
    mysql5.7 安装常见问题
    nginx 前后分离,地址重写,url匹配中遇到的问题
    nginx rewrite
    Nginx location 配置
    Nginx高级应用之Location Url 配置
    Zookeeper的功能以及工作原理
    [PY3]——IO——文件目录操作
    [PY3]——pwd | grp 模块
    [PY3]——时间处理——datetime | calendar
  • 原文地址:https://www.cnblogs.com/dekevin/p/4290006.html
Copyright © 2011-2022 走看看