0.1.0 • Published 1 year ago
outside-click-js v0.1.0
outside-click-js
点击指定元素外可以触发事件，借鉴v-click-outside，因为其是Vue指令化的，不能用于非Vue下使用
Install
$ npm install outside-click-js
#or
$ yarn add outside-click-jsUse
script
<body>
<div>outside</div>
<div id="click">click</div>
<script src="/dist/outside-click-js.min.js"></script>
<script>
window.onload = function (params) {
const div = document.querySelector('#click')
const { clickOutside } = window.$outsideClick
clickOutside({
el: div,
handler: () => {
console.log('outsideClick')
}
})
}
</script>
</body>requireorimport
// require
const { clickOutside, removeClickOutside } = require('outside-click-js')
// or import
import { clickOutside, removeClickOutside } from 'outside-click-js'
const div = document.querySelector('#click')
clickOutside({
el: div,
handler: () => {
console.log('outsideClick')
}
})
// remove
removeClickOutside(div)Config
clickOutside(options)
options:
el(必要)elementDOM: 绑定的元素handler(必要)Function: 触发的outside事件的函数，两个参数：e: 当前触发事件的eventel: 绑定outsideClick事件的元素
events(可选)Array: 要触发的事件，默认[click]或者移动端下[click, touchstart]middleware(可选)Function: 中间拦截器，返回值为true时执行handler,否则false拦截，两个参数同handler
removeClickOutside(target)
target(可选)elementDOM: 默认是清除全部绑定的事件，如果传入元素，则清除对应元素的事件