起始预定义函数

 function $(obj)

 {

     return document.getElementById(obj);

 }

1.用户登陆框架

 <!DOCTYPE html>

 <html>

 <head>

     <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>

     <title>TBUSF System</title>

     <script type="text/javascript" src="./html_api.js"></script>

 </head>

 <body style="background-color:gray;padding: 20px;">

 <!--页面标题-->

 <h1 style="text-align:center;color:yellow">welcome to TBUSF System</h1><br />

 <!--用户登陆-->

 <p1 style="color:black">User Name:</p1><br />

 <input id="user_id" tyle="text-align:center" type="text" name="username"><br />

 <p1 style="color:black">Code:</p1><br />

 <input id="code_id" type="text" name="code">

 <br><br>

 <!--点击进入下一个页面-->

 <input style="font-size:15px;" type="button" onclick="jump_page('user_id','code_id')" value="next page->">

 </body>

 </html>
./html_api.js(点击登陆所调用函数)：
 function jump_page(id_x,id_y)

 {

     try

     {

         x=$(id_x).value;

          y=$(id_y).value;

         if (x == '刘洋' && y == '1992')

             n =2;

         else

             n = 3;

         switch (n)

         {

             case 1:

                 window.open('https://www.baidu.com');

                 break;

             case 2:

                 window.location.href='file:///D:/我的文档/Programs/Html/web/System_display.html';

                 break

             default:

                 alert("fail");

         }

     }

     catch(err)

     {

         txt = err.message

         alert(txt);

     }

 }
2. 按钮点击，切换相应显示值框架
 <input type="button" id="modulation" value="ID" onclick="clickChange('modulation', 'ID', 'ID_change', 'modulation_display')">

 <p id="modulation_display"></p>
./html_api.js(点击登陆所调用函数)：
function clickChange(id_name, value_1, value_2, id_display)

{

    try

    {

        if ($(id_name).value == value_1)

            $(id_name).value = value_2;

        else if ($(id_name).value == value_2)

            $(id_name).value = value_1;

        else

            alert("id值有误");

        if ( $(id_name).value == value_1 )

            $(id_display).innerHTML = "ID";

        else if ( $(id_name).value == value_2 )

            $(id_display).innerHTML = "id_display";

        else

            $(id_display).innerHTML = "error";

    }

    catch(err)

    {

        txt = err.message

        alert(txt);

    }

}

HTML功能框架的更多相关文章

  1. atitit. 统计功能框架的最佳实践(1)---- on hibernate criteria

    atitit. 统计功能框架的最佳实践(1)---- on hibernate criteria 1. 关键字 1 2. 统计功能框架普通有有些条件选项...一个日期选项..一个日期类型(日,周,月份 ...

  2. Android图片加载框架最全解析（五），Glide强大的图片变换功能

    大家好,又到了学习Glide的时间了.前段时间由于项目开发紧张,再加上后来又生病了,所以停更了一个月,不过现在终于又可以恢复正常更新了.今天是这个系列的第五篇文章,在前面四篇文章的当中,我们已经学习了 ...

  3. 点滴积累【JS】---JS小功能（JS实现多功能缓冲运动框架)

    效果: 思路: 首先,多功能框架实现的功能是:css中所有的属性都可以添加进去(也可以把方法作为参数传递过去!),然后进行缓冲运动,比如:物体的高度.长度.颜色.字体大小.透明度等,都可以直接传入参数 ...

  4. iOS 系统架构及常用框架

    1.iOS基于UNIX系统,因此从系统的稳定性上来说它要比其他操作系统的产品好很多 2.iOS的系统架构分为四层,由上到下一次为:可触摸层(Cocoa Touch layer).媒体层(Media l ...

  5. CoreLocation框架的使用

    CoreLocation框架使用 一.地图和定位的简介 1.应用场景 周边:找餐馆/找KTV/找电影院(团购APP) 导航:根据用户设定的起点和终点,进行路线规划,并指引用户如何到达(地图APP) 2 ...

  6. IOS框架概览

    iOS是执行在iPhone.iPod Touch或iPad上的操作系统,之前叫做iPhone OS,iOS与Mac OS X有共同的基础架构和底层技术.但iOS是依据移动设备的特点而设计的,所以和Ma ...

  7. Java RESTful 框架的性能比较

    来源:鸟窝, colobu.com/2015/11/17/Jax-RS-Performance-Comparison/ 如有好文章投稿,请点击 → 这里了解详情 在微服务流行的今天,我们会从纵向和横向 ...

  8. 前端框架framework和库library的一点区别和记录

    本篇纯文字,无关代码,只是一点概念的记录 关于所谓前端 首先学的是HTML5.CSS3.JavaScript这三个 之后接触了一下UI框架,如layui和bootstrap 目前是打算去学VUE和an ...

  9. Android 9 新功能 及 API 介绍(提供了实用的模块化的功能支持，包括 人工智能)

      Android 9(API 级别 28)为用户和开发者引入了众多新特性和新功能. 本文重点介绍面向开发者的新功能. 要了解新 API,请阅读 API 差异报告或访问 Android API 参考. ...

随机推荐

  1. css3实现div自动左右动

    <!DOCTYPE html> <meta charset="UTF-8"/> <html> <head> <style> ...

  2. 微信小程序swiper使用网络图片不显示问题

    @ wxml代码: <view class="container"> <swiper indicator-dots="true}" autop ...

  3. vue 内存数组变化监听

    watch: { carts: { handler(val, oldVal) { subtotal(this.carts); console.log(this.carts) }, deep: true ...

  4. [易学易懂系列|rustlang语言|零基础|快速入门|（18）|use关键词]

    [易学易懂系列|rustlang语言|零基础|快速入门|(18)|use关键词] 实用知识 use关键词 我们今天来讲讲use关键词. 1.简单来说,use是给其他方法或资源定义一个别名,然后调用者, ...

  5. 使用Hbuilder打包app

    使用Hbuilder来打包自己的H5项目 第一步 在Hbuilder上新建一个"移动APP"wolf(项目命名随意)(如果没用引用mui框架的东西,"选择模板" ...

  6. nginx第一天

    nginx 介绍 常见的webserver(排行https://news.netcraft.com/archives/2018/) 老牌:httpd(早期叫Apache),开源,市场份额最高 微软:i ...

  7. vue2.0 移动端，下拉刷新，上拉加载更多 封装组件

    前言 在做移动端的避免不了 下拉刷新,上拉加载 直接上代码吧,哈哈 组件里: <template lang="html"> <div class="yo ...

  8. Spring Boot干货系列：（十二）Spring Boot使用单元测试（转）

    前言这次来介绍下Spring Boot中对单元测试的整合使用,本篇会通过以下4点来介绍,基本满足日常需求 Service层单元测试 Controller层单元测试 新断言assertThat使用 单元 ...

  9. django 之视图层及模板层 04

    目录 视图层 render方法是Template和Contex两个对象的组合使用 JsonResponse对象 CBV及源码分析 CBV 加装饰器的方式 模板层 模板语法传值 模板语法 变量 过滤器( ...

  10. JAVA笔记12-接口interface

    1.概念:接口是抽象方法和常量值得定义的集合.本质上,接口是一种特殊的抽象类,这种抽象类只包含常量和方法的定义,而没有变量和方法的实现. 接口定义举例: 2.接口特性: (1)接口可以多重实现:(接口 ...