npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

mobile-utils

v1.0.20

Published

common utils of mobile html5 development

Downloads

13

Vulnerabilities

Powered byPowered by Snyk
  • 0High
  • 0Medium
  • 0Low

Links

Git

Maintainers

tonyluatonylua

Keywords

html5

Readme

mobile-utils

common utils of mobile html5 development

1. How to install

npm i mobile-utils --save

2. How to use

//in requirejs config:
require.config({
	paths: {
		"mobile-utils": "YOUR_PATH/mobile-utils.min",
		...
	},
	...
});

//in page
import mUtils from 'mobile-utils';
...
mUtils.format.limit_decimal(someNum)

3. API

mUtils : object

the entry point

Kind: global namespace

mUtils.dom : object

Kind: static namespace of mUtils

dom.has_class(ele, clsName) ⇒ Boolean

判断元素是否有指定className

Kind: static method of dom

| Param | Type | | --- | --- | | ele | Element | | clsName | String |

dom.remove_class(ele, clsName) ⇒ void

删除className

Kind: static method of dom

| Param | Type | | --- | --- | | ele | Element | | clsName | String |

dom.add_class(ele, clsName) ⇒ void

添加className

Kind: static method of dom

| Param | Type | | --- | --- | | ele | Element | | clsName | String |

dom.real_style([ele], [styleName]) ⇒ String

获取计算样式

Kind: static method of dom

| Param | Type | Default | Description | | --- | --- | --- | --- | | [ele] | Element | | 目标元素 | | [styleName] | String | | 样式名 |

dom.append_HTML(dom, html) ⇒ void

在指定元素内的最末插入html

Kind: static method of dom

| Param | Type | | --- | --- | | dom | Element | | html | String |

dom.prepend_HTML(dom, html) ⇒ void

在指定元素内的开始插入html

Kind: static method of dom

| Param | Type | | --- | --- | | dom | Element | | html | String |

dom.tag_range_from_HTML(p_featureStr, p_html) ⇒ Object

根据特征值找到一段html中其所在的tag范围

Kind: static method of dom
Returns: Object - {start, end}

| Param | Type | Description | | --- | --- | --- | | p_featureStr | String | 特征值 | | p_html | String | 作为查找范围的html |

dom.transformXY(dom, x, y, [duration]) ⇒ void

为元素附加2d移动的css3样式

Kind: static method of dom

| Param | Type | Default | Description | | --- | --- | --- | --- | | dom | Element | | 目标元素 | | x | Number | | x轴上移动的px值 | | y | Number | | y轴上移动的px值 | | [duration] | Number | | 持续的毫秒数 |

mUtils.env : object

获取移动设备型号版本等环境信息

Kind: static namespace of mUtils
Default: { ua, version, ios, android, windows, blackberry, weixin, wVersion, qq, qVersion, touchSupport, hashSupport }

mUtils.event : object

Kind: static namespace of mUtils

event.on_tweened(dom, callback) ⇒ void

监听CSS3 transition动画结束

Kind: static method of event

| Param | Type | | --- | --- | | dom | Element | | callback | function |

event.on_page_loaded(callback) ⇒ void

如果监听时已加载则直接执行回调

Kind: static method of event

| Param | Type | | --- | --- | | callback | function |

event.on_page_rotated(callback) ⇒ void

监听设备方向改变

Kind: static method of event

| Param | Type | | --- | --- | | callback | function |

event.fake_click(callback, [domId]) ⇒ void

模拟点击事件

Kind: static method of event

| Param | Type | Default | Description | | --- | --- | --- | --- | | callback | function | | 回调函数 | | [domId] | String | 'fakeClick' | 模拟载体元素的id |

event.listen_select_change(sel, callback) ⇒ void

兼容性的监听select更改事件

Kind: static method of event

| Param | Type | Description | | --- | --- | --- | | sel | Element | 目标select元素 | | callback | function | 回调函数 |

event.is_event_on_target(targetDom) ⇒ Boolean

判断时间是否发生在指定元素范围内

Kind: static method of event

| Param | Type | Description | | --- | --- | --- | | targetDom | Element | 指定元素 |

mUtils.format : object

Kind: static namespace of mUtils

format.reverse_str(str) ⇒ String

字符串反转

Kind: static method of format

| Param | Type | | --- | --- | | str | String |

format.step_str(target, [step], [needReverse], [div]) ⇒ String

格式化手机号等，按位插入分隔符

Kind: static method of format

| Param | Type | Default | Description | | --- | --- | --- | --- | | target | Number | String | | 目标数字或字符串 | | [step] | Number | 4 | 插入分隔符的相隔位数 | | [needReverse] | Boolean | true | 是否要从右向左进行插入 | | [div] | String | " " | 分隔符 |

format.knot_num(num, [fix]) ⇒ String

添加千分位的数字分结号

Kind: static method of format

| Param | Type | Default | Description | | --- | --- | --- | --- | | num | Number | | 目标数字 | | [fix] | Number | | 如果同时要对小数限制位数则指定其位数 |

format.limit_decimal(num, [fix]) ⇒ String

限制小数位

Kind: static method of format

| Param | Type | Default | | --- | --- | --- | | num | Number | | | [fix] | Number | 2 |

format.num_pad_left(num, [leng]) ⇒ String

补全数字左侧的0

Kind: static method of format

| Param | Type | Default | Description | | --- | --- | --- | --- | | num | Number | | 目标数字 | | [leng] | Number | 2 | 最终位数 |

format.num_limit_leng(value, leng) ⇒ Number

只允许数字并限制位数

Kind: static method of format

| Param | Type | Description | | --- | --- | --- | | value | String | 原始输入值 | | leng | Number | 最大长度 |

format.trim(str) ⇒ String

去首尾空格

Kind: static method of format

| Param | Type | | --- | --- | | str | String |

mUtils.lang : object

Kind: static namespace of mUtils

lang.read_i18n(tmpl, ...args) ⇒ String

获取基于模板的文本值

Kind: static method of lang

| Param | Type | Description | | --- | --- | --- | | tmpl | String | 文本模板，格式为 'hello{0},world{1}' | | ...args | String | 用于替换的若干参数 |

mUtils.time : object

Kind: static namespace of mUtils

time.date_to_YMD(date, [div]) ⇒ String

将字符串转化为yyyymmdd格式

Kind: static method of time

| Param | Type | Default | Description | | --- | --- | --- | --- | | date | Date | | 目标时间 | | [div] | String | '-' | 分隔符 |

time.getTime([setting]) ⇒ Date

取得某个时间

Kind: static method of time

| Param | Type | Description | | --- | --- | --- | | [setting] | Object | {偏移值 offset, 基准时间 from, 是否置为0点 zeroTime, 是否置为1日 clean} |

time.today([zeroTime]) ⇒ Date

取得当天

Kind: static method of time

| Param | Type | Default | Description | | --- | --- | --- | --- | | [zeroTime] | Boolean | true | 是否置为0点 |

time.tomorrow([zeroTime]) ⇒ Date

取得明天

Kind: static method of time

| Param | Type | Default | Description | | --- | --- | --- | --- | | [zeroTime] | Boolean | true | 是否置为0点 |

time.yesterday([zeroTime]) ⇒ Date

取得昨天

Kind: static method of time

| Param | Type | Default | Description | | --- | --- | --- | --- | | [zeroTime] | Boolean | true | 是否置为0点 |

time.get_clean_date([p_month], [p_year]) ⇒ Date

取得一个某年某月1号0时的干净日期

Kind: static method of time

| Param | Type | Default | | --- | --- | --- | | [p_month] | Number | 1 | | [p_year] | Number | 今年 |

time.calender(p_year, [p_month]) ⇒ Array

取得某月的日历

Kind: static method of time
Returns: Array - 星期-日期 的二维数组: 周日0,周一1...

| Param | Type | Default | | --- | --- | --- | | p_year | Number | | | [p_month] | Number | 1 |

time.date_range(rangeNums, [from]) ⇒ Object

取得开始-结束的日期范围

Kind: static method of time

| Param | Type | Default | Description | | --- | --- | --- | --- | | rangeNums | Number | | 开始到结束的天数 | | [from] | Date | 今天 | 基准日期 |

time.is_leap_year([year]) ⇒ Boolean

是否闰年

Kind: static method of time

| Param | Type | Default | Description | | --- | --- | --- | --- | | [year] | Number | | 年份 |

mUtils.url : object

Kind: static namespace of mUtils

url.URLHash

将hash部分转化为object

Kind: static class of url

new URLHash([href], [hashChar], [separator])

构造方法

| Param | Type | Default | | --- | --- | --- | | [href] | String | 当前URL的hash | | [hashChar] | String | '#' | | [separator] | String | "&" |

urlHash.get(key) ⇒ String

取得某个值

Kind: instance method of URLHash

| Param | Type | | --- | --- | | key | String |

urlHash.put(key, value) ⇒ void

放置新值

Kind: instance method of URLHash

| Param | Type | | --- | --- | | key | String | | value | Any |

urlHash.putAll(keyValues) ⇒ void

一次性设置多个值

Kind: instance method of URLHash

| Param | Type | | --- | --- | | keyValues | Object |

urlHash.remove(key) ⇒ void

删除某个值

Kind: instance method of URLHash

| Param | Type | | --- | --- | | key | String |

urlHash.toString() ⇒ String

转换为字符串

Kind: instance method of URLHash

urlHash.clone() ⇒ URLHash

克隆一个实例

Kind: instance method of URLHash

url.query_params([query]) ⇒ Object

将query字符串转换为object

Kind: static method of url

| Param | Type | Default | Description | | --- | --- | --- | --- | | [query] | String | 当前url的query | 给定的query字符串 |

url.params_query(obj, [separator]) ⇒ String

将object转换为query字符串

Kind: static method of url

| Param | Type | Default | Description | | --- | --- | --- | --- | | obj | Object | | 键值对的对象 | | [separator] | Stribng | '&' | 分隔符 |

mUtils.utils : object

Kind: static namespace of mUtils

utils.ScrollLocker

锁定屏幕，限制其响应划动事件

Kind: static class of utils

new ScrollLocker(settings)

构造方法

| Param | Type | Description | | --- | --- | --- | | settings | Object | 构造参数对象，可以设置ignores忽略对象列表等 |

scrollLocker.lock()

执行锁定

Kind: instance method of ScrollLocker

scrollLocker.unlock()

解除锁定

Kind: instance method of ScrollLocker

utils.enable_html5_for_old() ⇒ void

确保老旧的设备可以使用html5的新元素

Kind: static method of utils

utils.check_appcache() ⇒ void

检查并监听applicationCache的更新情况

Kind: static method of utils

utils.page_to_top([top]) ⇒ void

将页面移动至指定位置

Kind: static method of utils

| Param | Type | | --- | --- | | [top] | Number |

utils.write_CSS(css) ⇒ void

在页面中动态写入css

Kind: static method of utils

| Param | Type | Description | | --- | --- | --- | | css | String | css字符串 |

utils.form_primary_valid(form, [submitCallback], [noticeFunction], [submitTriggerEvent], [submitTriggerTarget], [mismatchNoticeName]) ⇒ void

利用html5的原生pattern校验，对自定义了规则的表单项提示错误信息

Kind: static method of utils

| Param | Type | Default | Description | | --- | --- | --- | --- | | form | Element | | | | [submitCallback] | function | | 校验成功后的回掉函数，参数为 (form, fieldsObj) | | [noticeFunction] | function | | IOS only 提示错误的方法 | | [submitTriggerEvent] | String | 'click' | 触发校验的事件 | | [submitTriggerTarget] | String | '.submit' | 触发校验的目标元素上下文 | | [mismatchNoticeName] | String | 'mismatch' | 与pattern属性匹配的自定义提示语data-属性 |