HTML5+ 手机设备的信息, 屏幕信息, 音量信息, 系统信息的获取 device, screen, display, os

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <title>WebApp启动页</title>
    <script type="text/javascript" src="../js/jQuery.js"></script>
    <style type="text/css">
        body{
            width: 100%;
            padding: 0;
            margin: 0;
        }
        input{
            padding: .2rem;
            margin: .5rem auto 0 auto;
            font-size: .5rem;
            border-radius: .5rem;
            display: block;
            width: 5rem;
            color: red;
            background: white;
        }
        #text{
            line-height: .6rem;
            font-size: .35rem;
            color: red;
            padding: .3rem;
            text-align: center;
        }
    </style>
</head>
<body>
    <input type="button" value="拨打电话" id="Dial" />
    <input type="button" value="手机响起" id="Beep" />
    <input type="button" value="手机震动" id="Vibrate" />
    <input type="button" value="常亮设置" id="SetWakelock" />
    <input type="button" value="是否常亮" id="IsWakelock" />
    <input type="button" value="设置音量" id="SetVolume" />
    <input type="button" value="获取音量" id="GetVolume" />
    <input type="button" value="亮度设置" id="SetBrightness" />
    <input type="button" value="亮度获取" id="GetBrightness" />
    <input type="button" value="横屏竖屏" id="LockOrientation" />
    <input type="button" value="解除锁屏" id="UnlockOrientation" />
    <input type="button" value="返回主页" id="ReturnIndex" />
    <div id="text"></div>
</body>
</html>
<script type="text/javascript">
    /**
     * 页面布局rem重置语句
     */
    $(‘html‘).css("font-size", $(window).width()/10);

    /**
     * 手机端页面初始化事件, 所有操作均要写在在该事件内
     * 否则可能会出现错误: plus is not defind
     */
    document.addEventListener(‘plusready‘, function(){
        /**
         * 返回首页的事件
         */
        $(‘#ReturnIndex‘).on(‘touchstart‘, function(){
            location.href = ‘Index.html‘;
        });

        /**
         * 获取手机设备信息 plus.device
         */
        var device = plus.device;
        $(‘#text‘).append(‘国际移动设备身份码: ‘ + device.imei + ‘<br>‘);
        for(var i = 0; i < device.imsi.length; i++){
            $(‘#text‘).append(‘国际移动用户识别码: ‘ + device.imsi[i] + ‘<br>‘);
        }
        $(‘#text‘).append(‘设备的型号信息: ‘ + device.model + ‘<br>‘);
        $(‘#text‘).append(‘设备的生产厂商信息: ‘ + device.vendor + ‘<br>‘);
        $(‘#text‘).append(‘设备的唯一标识号: ‘ + device.uuid + ‘<br>‘);

        /**
         * 拨打电话的  device.dial( 号码, 是否需要用户确认 )
         * 发出蜂鸣声  device.beep( 次数 )
         * 手机震动  device.vibrate( 时间毫秒 )
         * 设置设备屏幕是否常亮  device.setWakelock( 是否 )
         * 获取设备屏幕是否常亮   Bool isWakelock = device.isWakelock()
         * 设置系统音量  device.setVolume( 0-1之间的值 )
         * 获取系统音量  Number volume = device.getVolume()
         */
        $(‘#Dial‘).on(‘touchstart‘, function(){
            device.dial(‘18353355962‘, true);
        });
        $(‘#Beep‘).on(‘touchstart‘, function(){
            device.beep(3);
        });
        $(‘#Vibrate‘).on(‘touchstart‘, function(){
            device.vibrate(1000);
        });
        $(‘#SetWakelock‘).on(‘touchstart‘, function(){
            device.setWakelock(true);
        });
        $(‘#IsWakelock‘).on(‘touchstart‘, function(){
            $(‘#text‘).append(‘是否常亮: ‘ + device.isWakelock() + ‘<br>‘);
        });
        $(‘#SetVolume‘).on(‘touchstart‘, function(){
            device.setVolume(0.6); //某些情况下可能不准确
        });
        $(‘#GetVolume‘).on(‘touchstart‘, function(){
            $(‘#text‘).append(‘音量值为: ‘ + device.getVolume() + ‘<br>‘);
        });

        /**
         * 获取手机屏幕信息  var screen = plus.screen
         */
        screen = plus.screen;
        $(‘#text‘).append(‘设备屏幕高度分辨率: ‘ + screen.resolutionHeight + ‘<br>‘);
        $(‘#text‘).append(‘设备屏幕宽度分辨率: ‘ + screen.resolutionWidth + ‘<br>‘);
        $(‘#text‘).append(‘逻辑分辨率与实际分辨率的比例: ‘ + screen.scale + ‘<br>‘);
        $(‘#text‘).append(‘设备屏幕水平方向的密度: ‘ + screen.dpiX + ‘<br>‘);
        $(‘#text‘).append(‘设备屏幕垂直方向的密度: ‘ + screen.dpiY + ‘<br>‘);

        /**
         * 设置屏幕亮度  screen.setBrightness( 0-1之间的数 );
         * 获取品目亮度  Number brightness = screen.getBrightness()
         * 锁定屏幕方向  screen.lockOrientation( orientation )
         * 1: "portrait-primary": 竖屏正方向
         * 2: "portrait-secondary": 竖屏反方向
         * 3: "landscape-primary": 横屏正方向
         * 4: "landscape-secondary": 横屏反方向
         * 5: "portrait": 竖屏正方向或反方向
         * 6: "landscape": 横屏正方向或反方向
         * 解除锁定屏幕方向: screen.unlockOrientation
         */
        $(‘#SetBrightness‘).on(‘touchstart‘, function(){
            screen.setBrightness(0.6);
        });
        $(‘#GetBrightness‘).on(‘touchstart‘, function(){
            $(‘#text‘).append(‘屏幕亮度为: ‘ + screen.getBrightness() + ‘<br>‘);
        });
        $(‘#LockOrientation‘).on(‘touchstart‘, function(){
            screen.lockOrientation("landscape-primary");
        });
        $(‘#UnlockOrientation‘).on(‘touchstart‘, function(){
            screen.unlockOrientation();
        });

        /**
         * 获取屏幕显示区域信息 var display = plus.display
         */
        var display = plus.display;
        $(‘#text‘).append(‘应用可使用的屏幕高度逻辑分辨率: ‘ + display.resolutionHeight + ‘<br>‘);
        $(‘#text‘).append(‘应用可使用的屏幕宽度逻辑分辨率: ‘ + display.resolutionWidth + ‘<br>‘);

        /**
         * 获取系统信息  var os = plus.os;
         */
        var os = plus.os;
        $(‘#text‘).append(‘系统语言信息: ‘ + os.language + ‘<br>‘);
        $(‘#text‘).append(‘系统版本信息: ‘ + os.version + ‘<br>‘);
        $(‘#text‘).append(‘系统的名称: ‘ + os.name + ‘<br>‘);
        $(‘#text‘).append(‘系统的供应商信息: ‘ + os.vendor + ‘<br>‘);
    });
</script>
时间: 2024-12-03 05:11:52

HTML5+ 手机设备的信息, 屏幕信息, 音量信息, 系统信息的获取 device, screen, display, os的相关文章

css3 html5 手机设备 列表的弹回和加速移动

<style type="text/css"> * { margin: 0; padding: 0; } .min { width: 350px; height: 400px; overflow: hidden; } .min ul { list-style: none; display: block; } .min ul li { height: 30px; } </style> <body> <div class="min&quo

Android设备网络、屏幕尺寸、SD卡、本地IP、存储空间等信息获取工具类

Android设备网络.屏幕尺寸.SD卡.本地IP.存储空间.服务.进程.应用包名等信息获取的整合工具类. 1 package com.qiyu.ddb.util; 2 3 import android.annotation.SuppressLint; 4 import android.annotation.TargetApi; 5 import android.app.Activity; 6 import android.app.ActivityManager; 7 import androi

android 安卓APP获取手机设备信息和手机号码的代码示例

下面我从安卓开发的角度,简单写一下如何获取手机设备信息和手机号码 准备条件:一部安卓手机.手机SIM卡确保插入手机里.eclipse ADT和android-sdk开发环境 第一步:新建一个android工程(JinshanTest), 并需要在工程的AndroidManifest.xml文件中,添加权限 <uses-permission android:name="android.permission.READ_PHONE_STATE"/> 图例: 第二步:新建一个工具类

关于Android的Build类——获取Android手机设备各种信息

经常遇到要获取Android手机设备的相关信息,来进行业务的开发,比如经常会遇到要获取CPU的类型来进行so库的动态的下载.而这些都是在Android的Build类里面.相关信息如下: private String loadSystemInfo() { StringBuilder sb = new StringBuilder(); sb.append("主板:" + Build.BOARD + "\n"); sb.append( "系统启动程序版本号:&q

Android 获取手机设备等的信息

获取手机设备型号等信息: 如图华为P6手机获取是手机设备信息值: 代码如下: tvStr = (TextView) findViewById(R.id.tv_titlebar); String phoneInfo = "Product: " + android.os.Build.PRODUCT + "\n"; phoneInfo += "CPU_ABI: " + android.os.Build.CPU_ABI + "\n";

?Swift获取手机设备信息

使用UiDevice获取设备信息: 获取设备名称 let name = UIDevice.currentDevice().name 获取设备系统名称 let systemName = UIDevice.currentDevice().systemName 获取系统版本 let systemVersion = UIDevice.currentDevice().systemVersion 获取设备模型 let model = UIDevice.currentDevice().model 获取设备本地

android -------- 获取手机设备信息

最近在开发中,需要用到一些系统信息,总结了一下 /** * Created by zhangqie on 2019/2/26 * Describe: 系统工具类 */ public class EquipmentUtil { /** * 获取当前手机系统语言. * * @return 返回当前系统语言.例如:当前设置的是“中文-中国”,则返回“zh-CN” */ public static String getSystemLanguage() { return Locale.getDefault

[HTML5]手机屏幕分辨率和浏览器分辨率

在使用CSS3的中有如下类似代码 Html代码 @media screen and (max-width:480px){ -- } 意思是在最大宽度为480px的设备上应用{}里面的样式.这里的width,注意是手机浏览器的分辨率,而不是手机设备的屏幕分辨率.比如苹果4的手机屏幕分辨率是960x640.而其自带的Safari浏览器的分辨率是320*480.我们可以通过如下代码检测所用的浏览器的分辨率: Js代码 $("#info").html("(您的浏览器的分辨率为:&qu

《Javascript权威指南》学习笔记之十九--HTML5 DOM新标准---处理文档元信息和管理交互能力

一.了解DOM 1.DOM是Document Object Model的缩写,即文档对象类型,是文档在内存中的表示形式,是一个应用程序接口,定义了文档的逻辑结构以及一套访问和处理文档的方法. 2.HTML DOM与Core DOM的区别:前者提供了大量的方法和属性,与现有的程序模型一致,更便于脚本的编写者控制. 二.document对象 使用window.document属性返回一个document对象,代表当前window内加载的文档.window可以省略.winName.document返回