MCPcopy Index your code
hub / github.com/fsjohnhuang/preview

github.com/fsjohnhuang/preview @v1.2.0

Chat with this repo
repository ↗ · DeepWiki ↗ · release v1.2.0 ↗ · + Follow
8 symbols 17 edges 1 files 0 documented · 0% 6 cross-repo links
What it actually does AI analysis from the code graph — generated when you open this
loading…
README

preview v1.2.0

纯浏览器端的图片预览组件

支持IE5.5~IE11、Chrome、FF、Safari和Opera

Usage

<input type="file" id="icon1" accept="image/jpeg"/>&nbsp;<button onclick="pv1.reset()">重置</button>





<input type="file" id="icon2" accept="image/jpeg"/>&nbsp;<button onclick="pv2.reset()">重置</button>





<script type="text/javascript" src="https://github.com/fsjohnhuang/preview/raw/v1.2.0/preview.js"></script>
<script type="text/javascript">
  var get = function(id){
    return document.getElementById(id);
  };
  Preview.defaults.onlegal = false;
  Preview.defaults.onillegal = true;
  var pv1 = new Preview(get('icon1'), get('pv1'), {
    onlegal: function(path, ext, accept){
      alert(pv1 === this);
      alert('文件路径:' + path);
      alert('文件后缀:' + ext);
      alert('期待的MIME类型:' + accept);
        return true;
    },
    onillegal: false 
  });
  var pv2 = Preview(get('pv2'), get('icon2'));
</script>

v1.2.0

  1. Preview构造函数添加opts配置入参,具体配置项如下:

onlegal,当路径后缀与file的accept属性值匹配时触发,返回true(默认值)时将预览图片,false则预览图片。

onillegal,当路径后缀与file的accept属性值不匹配时触发,返回true时将预览图片,false(默认值)则预览图片。

  1. 添加Preview.defaults.onlegal=truePreview.defaults.onillegal=false默认配置项。

v1.1.0

  1. 图片预览实例添加reset()方法,用于重置组件;

  2. Preview构造函数入参由原来的顺序设置fileEl,previewEl改为无序设置。

v.1.0

全局重构

v.0.5

IE10+通过window.URL.createObjectURL替代FileReader,缩短Data URI Scheme长度从而提高性能。

v0.4

新增上传文件MIME类型筛选。默认值为image/*,通过input的accept属性值设置。

v0.3

修复FF3.0不支持FileReader的bug。

v0.2

修复IE11下当document.documentMode < 10时无法预览图片的bug。

v0.1

通过滤镜和FileReader实现图片预览功能。

Core symbols most depended-on inside this repo

clearRender
called by 2
preview.js
isRender
called by 2
preview.js
render
called by 2
preview.js
readAsDataURL
called by 1
preview.js
readPath
called by 1
preview.js
exec
called by 1
preview.js
resetRender
called by 1
preview.js
resetVal
called by 1
preview.js

Shape

Function 8

Languages

TypeScript100%

Modules by API surface

preview.js8 symbols

For agents

$ claude mcp add preview \
  -- python -m otcore.mcp_server <graph>

⬇ download graph artifact

Ask about this repo answers extend the page