jsignature 중국어 개발 튜토리얼-JS 튜토리얼-php.cn

집

웹 프론트엔드

JS 튜토리얼

jsignature 중국어 개발 튜토리얼

青灯夜游

Mar 02, 2022 am 09:45 AM

javascript jquery

jSignature는 브라우저 창에서 서명을 단순화하고 사용자가 마우스, 펜, 손가락을 사용하여 서명을 작성할 수 있는 간단한 플러그인입니다. 다음 기사에서는 jsignature 중국어 개발 튜토리얼을 공유하고 jsignature 플러그인의 사용법을 간략하게 이해하는 것이 모든 사람에게 도움이 되기를 바랍니다.

jSignature는 획의 벡터 윤곽선을 통해 서명을 캡처합니다. jSignature는 PNG 이미지를 출력할 수 있으며 유연성이 뛰어납니다.

github: https://github.com/brinley/jSignature
http://www.unbolt.net/jSignature/ 영어 문서의 일부

이 문서에는 완전한 디지털 서명이 있습니다. 데모 마지막에 백그라운드 처리 php 버전은 하단의 QQ 그룹 계정을 보시고 다운로드에 들어가주세요. , 내 것은 jquery2 .1.4이고 jSignature 버전은 jSignature v2입니다. 버전이 최신일수록 h5에 쓰기 효과가 더 부드러워지기 때문입니다.

이 문서는 이전 버전의 번역과 개인적인 경험을 바탕으로 일부 수정되었음을 참고하세요

마지막으로 몇 가지 팁과 개인적인 경험이 있습니다

참고:
이 플러그의 최신 버전- IE8을 지원하는 경우 로컬 서버에서 테스트하기 위해 넣으십시오. 일부 js 파일 요청 프로토콜은 Windows 로컬 파일 프로토콜을 지원하지 않기 때문에 직접 열지 마십시오.

file://과 http 요청의 차이점

If 프로토콜을 요청하는 방법의 차이를 모르시면 얽매이지 마시고 직접 가세요 로컬 서버에서 테스트

기본적으로 사용하는 메소드

<div id="signature"></div>
<script type="text/javascript" src="jquery.js"></script>
<script language="JavaScript" type="text/javascript" src="jSignature.js"></script>
 
 <script type="text/javascript">
 $(document).ready(function() {
   $("#signature").jSignature();
 });
 </script>

로그인 후 복사

html5에서 이렇게만 인용하면

브라우저를 사용해야 합니다

<div id="signature"></div>
<script type="text/javascript" src="jquery.js"></script>
<script language="JavaScript" type="text/javascript" src="jSignature.js"></script>
 
   <!--[if lt IE 9]>
        <script type="text/javascript" src="flashcanvas.js"></script>
        <![endif]-->
 
 <script type="text/javascript">
 $(document).ready(function() {
   $("#signature").jSignature();
 });
 </script>

로그인 후 복사

이 호환성 문제는 해결되었습니다

방법:

방법 이름cleargetDataimportData

사용 방법	지침
.jSignature("지우기" )	캔버스 지우고 재설정
.jSignature("getData", "base30")	캔버스 재설정 양식이 게시되거나 제출되었습니다.
.jSignature("importData",dataurl)	위의 getData 메소드를 사용하여 추출되었습니다. 데이터 URL은 기존 jSignature 캔버스를 업데이트합니다.

옵션 매개변수:

매개변수 이름widthheightcolor background-colorlineWidthcssclass

导入图像数据

画布图像导入并保存到数据库后，可以通过其base64编码的字符串轻松显示图像，

要通过jQuery来做，可以使用类似的东西

1	`$("<img class='imported'></img>").attr("src",sig.jSignature('getData', 'base30')).appendTo(sig);`

로그인 후 복사

或者直接从服务器端输入数据串到img的的src属性中

1	`<img src="<? echo $datastring ?>"` `/>`

로그인 후 복사

您还可以将dataUrl导入到jSignature画布中，以便您可以通过以下JavaScript代码编辑签名

1	`$("#signature").jSignature("importData",dataurl);`

로그인 후 복사

dataurl是上面使用的相同的数据串。您可以在下面的演示中通过从其中一个jSignature复制数据字符串，然后单击另一个jSignaure的“导入数据到画布”，

并将数据字符串粘贴到出现的对话框中，从而在下面的演示中看到它

giehub官方版本部分

jSignature是一个jQuery插件，它简化了浏览器窗口中签名捕获字段的创建，允许用户使用鼠标，笔或手指绘制签名。

j签名将签名作为笔画的向量轮廓捕获。虽然jSignature也可以导出伟大的位图（PNG），提取签名的高度可扩展的行程移动坐标（也称为矢量图像）允许更大的灵活性

进行额外的努力（通过平滑和压力模拟），使得笔画在屏幕上看起来很漂亮，而这些画面由阁下绘制。

所有主要的桌面，平板电脑和手机浏览器的支持。默认情况下使用HTML5画布元素。我们依靠基于canvas元素模拟器Flash（flashcanvas）当实际帆布不支持的浏览器（Internet Explorer 8节下）。

实时jsignature呈现只有装置适当的“漂亮的”逼近我们捕获。捕获的数据总是相同的-我们尽可能捕捉尽可能多的运动坐标。笔触的绘制不同于浏览器的功能，设备的效率，屏幕大小。

捕获的签名的屏幕表示的这种降级和增强是为了确保渲染不会影响捕获的响应性而进行的。例如，在缓慢渲染设备（Android浏览器，基于FlashCanvas的Canvas仿真）上，平滑被踢出了一个缺口，以补偿捕获的笔画坐标中的巨大差距 - 捕获设备效率低下的结果。在所有情况下，客户都会对图纸的反应和美观感到高兴。

jSignature可以轻松地将其自己调入现有样式的网站。 jSignature自动检测包装元素上使用的颜色（文字颜色=笔颜色，背景=背景），并自动选择“装饰”（签名行）的令人愉快的中间色调。 jSignature适用于固定和可变宽度的网页设计，以及各种大小的屏幕（手机，平板电脑，电脑屏幕），并且当父元素更改大小时自动重新绘制绘图区域和签名。

demos here：
http://brinley.github.io/jSignature/

将jSignature添加到您的页面

查看源代码树中的libs文件夹。从那里挑选3个文件：

1、jSignature.min*.js (“*”表示您有选择。您可以选择常规的以jQuery为中心的构建或特殊的jQuery.NoConflict构建)

2、flashcanvas.js

3、flashcanvas.swf

jSignature取决于（至少最新版）jQuery

如果您不打算支持IE 7和8，则不需要下载FlashCanvas文件。

请注意，FlashCanvas是两个文件的连贯一组，分别是flashcanvas.swf和flashcanvas.js，这两个文件必须位于同一个文件夹中。不要将它们从单独的文件夹托管，因为flashcanvas.js在与其提供的同一文件夹中查找flashcanvas.swf。不要将flashcanvas.js重命名为其他任何东西，因为它在DOM中通过该名称查找自己，以找出从哪里加载flashcanvas.swf。

jSignature本身有三个不同的代码段转换成一个最小的可部署：:

准备Canvas元素的代码。它包括检测浏览器功能，最大限度地利用div的范围内的画布，在需要时使用Flashcanvas设置仿真画布。
处理实际签名捕获+数据导入/导出API的代码。它附加并监听移动事件处理程序，将数据结构中的笔触数据存储起来，处理API调用。
插件可帮助您获取方便您的格式的签名数据，如原始数据坐标，图像，压缩的url兼容字符串，SVG。

如果您确定受众受限于特定的浏览器引擎（您可以通过嵌入式浏览器小部件部署，使用类似PhoneGap的部件），您可以卷起袖子并将其放在第1部分。如果你知道你只需要一个导出/导入插件，那么从最小化的可部署中删除你不需要的插件。

更多自定义数据导出/导入插件可以单独加载，而无需重新设置主要部署。但是，缩小是有趣和容易的。只需看看wscript.py文件，并更改几行以包含/排除某些部分。

对于“通用”部署场景（包括旧IE的支持），将其添加到您的页面：

<!-- this, preferably, goes inside head element: -->
<!--[if lt IE 9]>
<script type="text/javascript" src="path/to/flashcanvas.js"></script>
<![endif]-->
 
<div id="signature"></div>
 
<!-- you load jquery somewhere before jSignature ... -->
<script src="path/to/jSignature.min.js"></script>
<script>
    $(document).ready(function() {
        $("#signature").jSignature()
    })
</script>

로그인 후 복사

解释：

[if lt IE 9]部分加载IE小于9的Flashcanvas库（仅在IE上支持Flashcanvas，所以没有任何意义进行功能检测。）
我们标记一个div，其中将创建canvas元素。任何ID或其他jQuery选择器都可以。
我们加载jSignature插件。
最后，脚本调用指定DIV中的签名小部件。

API

以下方法暴露在jQuery对象之上：.jSignature（String command，* args）

参数因命令而异。当提供命令时，命令将是一个带有jSignature命令的字符串。目前支持的命令：

init是默认的，假定的动作。 init需要一个参数 - 一个设置对象。您可以省略命令，并在init中传递设置对象。返回（以传统的jQuery链接方式）jQuery对象引用应用插件的元素。
reset 复位只是清除签名板，数据存储（并放回签名线和其他装饰）。返回（以传统的jQuery链接方式）jQuery对象引用应用插件的元素。
clear reset别名，历史遗留
getData 接受参数 - 数据格式的名称。返回适合数据格式的数据对象
setData 需要两个参数 - 数据对象，数据格式名称。当数据对象是以data-url模式格式化的字符串时，您不需要指定数据dormat名称。数据格式名称（mime）将从data-url前缀中隐含。见下面的例子。返回（以传统的jQuery链接方式）jQuery对象引用应用插件的元素。
importData setData的别名，历史遗留
listPlugins 接受一个参数 - 表示要列出的插件的类别（仅导出，此时支持的导入）的字符串。返回字符串数组。
disable 使画布只读，并禁用jSignature按钮
enable 使画布只读，并启用jSignature按钮
isModified 如果jSignature被修改，返回一个布尔值true，否则返回false。
getSettings 返回jSignature实例的可配置设置。
updateSetting 需要三个参数 - 设置名称，新值，布尔值，如果更改应该影响当前签名或将来的笔画。这允许您更新某些设置，如lineWidth或线条颜色，使用第三个参数可以使更改适用于现有笔画。目前，更新现有笔画的更改仅适用于像颜色这样的几个设置。返回更新的值

使用实例：

var $sigdiv = $("#signature")
$sigdiv.jSignature() //初始化 jSignature 插件
// after some doodling...
$sigdiv.jSignature("reset") // 清除画布并在其上重新装饰。
// 将签名作为SVG并在浏览器中呈现SVG。
// （!!!来自IMG元素的内联SVG渲染在所有浏览器中都不起作用!!!）
//这个导出插件返回一个数组[mimetype，base64编码的SVG的字符串的签名笔画]
var datapair = $sigdiv.jSignature("getData", "svgbase64") 
var i = new Image()
i.src = "data:" + datapair[0] + "," + datapair[1] 
$(i).appendTo($("#someelement")) // append the image (SVG) to DOM.
 
// 获取签名为“base30”数据对
// 数组[mimetype，jSignature的自定义Base30压缩格式的字符串]
datapair = $sigdiv.jSignature("getData","base30") 
// 将数据重新导入jSignature。
// 导入插件了解数据网址格式的字符串，如“data：mime; encoding，data”
$sigdiv.jSignature("setData", "data:" + datapair.join(","))

로그인 후 복사

数据导入/导出（和插件）

以下插件（数据格式）是主线j签名的一部分，可分发：

default （仅限EXPORT ONLY）（BITMAP）数据格式与输出格式j兼容，在早期版本中生成的getData被调用时不带参数。默认情况下，默认情况下（默认情况下）调用$ obj.jSignature（“getData”）数据格式是Canvas - data-url格式化的base64编码（可能的PNG）位图数据，如下所示：data：image / png; base64，i1234lkj123; k4; l1j34l1kj3j ...此导出调用返回单个数据网址格式的字符串。
native （导出和导入）（VECTOR）（VECTOR）数据格式是绘制笔画的自定义表示形式，作为具有道具.x，.y的对象数组，每个对象都是一个数组。这个JavaScript对象结构是每个绘图笔画存储在jSignature中的实际数据结构。该结构专门用于收集笔触数据点的速度和效率。（尽管它有一些反直觉，章鱼式的结构，它（a）允许快速堆积双轴坐标，而不需要为每个数据点创建Point对象，（b）提供非常简单的循环，基于数据的处理）。虽然您可以JSONify，它传递，解析，从此渲染，它可能不是最有效的方式来存储数据，因为内部格式可能会改变其他主要版本的jSignature。我建议将base30格式视为直接的，但紧凑的等同于“native”-as-JSON。这个数据适用于运行统计信息（尺寸，画布上的签名位置）和编辑笔画（例如允许“撤消最后一个笔画”）。
base30 (별칭 image/jSignature; base30) (EXPORT AND IMPORT) (VECTOR) (VECTOR) (VECTOR) (VECTOR) (VECTOR) (VECTOR) 데이터 형식은 Base64 기반 압축입니다. 엄청나게 컴팩트하고 기본 URL 호환성을 위한 형식입니다. 이는 모든 벡터의 압축된 문자열 표현으로 압축된 "기본" 데이터 구조입니다. 이 형식을 렌더링 가능한 형식(SVG, 언어 기본 좌표 배열)으로 압축을 풀기 위한 코드 예제(.Net, PHP, Ruby)는 extras 폴더에 제공됩니다. 데이터를 서버로 전송하는 한 가지 가능한 방법은 JSONP이며, 실제 URL 길이 제한은 2000자 이하입니다(IE에서 적용). 이 압축 형식은 로컬 URL과 호환되며 다시 인코딩할 필요가 없지만 대부분의 복잡하지 않은 서명의 2000자 내에 맞습니다. base30 （别名image / jSignature; base30）（EXPORT AND IMPORT）（VECTOR）（VECTOR）（VECTOR）（VECTOR）（VECTOR）（VECTOR）数据格式是一种基于Base64的压缩格式，用于荒谬的紧凑性和本机url兼容性。它是压缩成所有向量的紧凑字符串表示形式的“本机”数据结构。 extras文件夹中提供了将此格式解压缩为可呈现格式（SVG，语言本机坐标数组）的代码示例（.Net，PHP，Ruby）。将数据传送到服务器的一种可能的方法是JSONP，其具有不超过2000个字符的实际URL长度限制（由IE强加）。这种压缩格式是本地URL兼容的，无需重新编码，但适合大多数非复杂签名的2000个字符。
svg （别名image / svg + xml）（仅EXPORT ONLY）（VECTOR）（VECTOR）数据格式生成SVG图像（SVG XML文本）的签名。所有笔画都被去噪和平滑。这种格式是“易于查看”和“高度可扩展”之间的良好媒介。目前大多数浏览器都支持查看SVG，但是，这种格式可以无限缩放和增强打印。数据是文本，容易存储和传输。对jSignature（“getData”，“svg”）的调用返回一个数组，形式为“”image / svg + xml“，”svg xml here“]。
svgbase64 （别名image / svg + xml; base64）（仅限EXPORT ONLY）（VECTOR）与“svg”插件相同，但使用base64编码压缩SVG XML文本。虽然现在有许多浏览器已经内置了base64编码器（btoa（）），但有些则像Internet Explorer那样没有。该插件具有自己的（短而高效）的基于软件的base64编码器的副本，该编码器在缺少btoa（）的浏览器上被调用。对jSignature（“getData”，“svgbase64”）的调用返回一个[“image / svg + xml; base64”，“base64编码的svg xml这里”）的数组。这个双组件数组很容易变成data-url格式的字符串（“data：”+ data.join（“，”）），或者转换成args，并作为表单值传递给服务器。
image

svg(별칭 image/svg+xml) (내보내기 전용) (VECTOR) (VECTOR) 데이터 형식은 SVG 이미지(SVG XML 텍스트)에 대한 서명을 생성합니다. 모든 스트로크는 노이즈가 제거되고 부드러워집니다. 이 형식은 "보기 쉬움"과 "확장성 높음" 사이의 좋은 매체입니다. 현재 대부분의 브라우저는 SVG 보기를 지원하지만 이 형식은 인쇄를 위해 무한히 확장되고 향상될 수 있습니다. 데이터는 텍스트이며 저장 및 전송이 쉽습니다. jSignature("getData", "svg")를 호출하면 ""image/svg+xml","svg xml here"] 형식의 배열이 반환됩니다.

svgbase64(별칭 이미지 /svg+xml;base64) (내보내기 전용) (VECTOR) "svg" 플러그인과 동일하지만 현재 많은 브라우저에 base64 인코더(btoa())가 내장되어 있지만 base64 인코딩을 사용하여 SVG XML 텍스트를 압축합니다. Internet Explorer처럼 플러그인에는 jSignature("getData") , "svgbase64")에 대한 btoa()가 없는 브라우저에서 호출되는 자체(짧고 효율적인) base64 인코더 복사본이 있습니다. 호출은 ["image/svg+xml;base64","base64로 인코딩된 svg xml here") 배열을 반환합니다. 이 두 구성 요소 배열은 쉽게 데이터 URL 형식의 문자열("data". :" + data)로 변환될 수 있습니다. .join(",")) 또는 args로 변환되어 양식 값으로 서버에 전달됩니다.

image (EXPORT ONLY) (BITMAP) 데이터 형식은 위와 동일합니다. "기본" 데이터 형식은 본질적으로 동일하지만 MIME 유형과 데이터가 "svg" 내보내기에서 생성된 것과 유사한 배열 구조에서 별도의 개체가 되도록 구문 분석됩니다. 예(축약됨) ["image/png;base64", " i123i412i341jijalsdfjijl234123i...”]. 이미지 내보내기 필터는 (다소 얄팍한) 브라우저 지원에 의존하고 불필요한 데이터를 선택하므로 데모 및 개발용으로만 사용하는 것이 좋습니다.

내보내기/저장 형식을 선택하세요.
jSignature에서 "이미지"를 원한다는 것을 알고 있지만, 대신 후반 작업 서버 측에서 "base30" 또는 "svg" 데이터를 캡처하고 비트맵을 내보낼 경우 향상+렌더링하는 것을 고려해 보세요. , 이미지는 실제 그림 색상, 크기, 불완전성을 유지하며 가장 중요하게는 모든 브라우저에서 실행되지 않을 수 있습니다.
jSignature가 어두운 색상 배경 + 밝은 색으로 설계된 경우 장식(서명 선)이 이미지에 표시됩니다. 펜 색상 - 회색 서명 선을 덮는 밝은 그림이 있는 어두운 배경 배경이 펜과 동일한 강도(예: 파란색)인 경우 인쇄할 때 거의 쓸모가 없습니다. 빨간색), 이 경우 흑백으로 인쇄하면 이미지가 짙은 회색 직사각형으로 표시됩니다. 페이지 색상을 변경하면 이제 캡처된 이미지에 해당 색상이 입혀지기 시작합니다.
Android 1.6 -2.2(2.3?)에서는 canvas.toDataURL 메서드(비트맵 내보내기 기능)를 지원하지 않습니다.

작은 화면(휴대폰)은 작고 보기 흉한 비트맵을 생성합니다. 🎜🎜🎜🎜캔버스로 내보낸 비트맵은 모든 중간 그림자 및 배경 픽셀을 유지하므로 벡터에 비해 크기가 엄청납니다. 🎜🎜🎜🎜흰색 시그니처를 사용하여 웹스타일 위에 검정색만 강제로 캡쳐하고 싶다면 비트맵 내보내기를 사용하세요. 모든 비트맵 데이터가 포함된 데이터베이스를 백업하는 데 하루 이상이 소요되므로 데이터베이스 관리자가 비명을 지르게 하려면 비트맵 내보내기를 사용하십시오. 귀하의 서명 캡처 형식이 잘 디자인된 새로운 wizbang 제품/서비스에 쉽게 통합될 수 없기 때문에 영업/사업 부서가 당신을 비명을 지르게 하려면 비트맵 내보내기를 사용하십시오. 선택한 서명 형식 내보내기가 모든 대상 플랫폼에서 사용할 수 없는 이유를 설명하려면 비트맵 내보내기를 사용하세요. 지금 쉬운 방법을 택하고 해고된 후 IT 담당자가 들어오게 하고 수집하기로 결정한 다채로운 픽셀에 ImageMagic 스마트 카드를 적용하는 어려운 작업을 수행하려면 비트맵 내보내기 형식을 사용하십시오. 🎜

如果使用捕获的签名与“业务”或“打印”或“多个演示场所”有任何关系，则使用“base30”或“svg”数据等矢量格式，并在后期制作中增强+渲染。 “extras”文件夹中可以找到解压缩和样本，基本的渲染代码（.Net，截至2012年2月的PHP）。您将使用这些为核心，为您自己的渲染逻辑提供可循环的坐标数据数组。

Events（事件）

jSignature初始化的dom元素在笔画完成后立即发出“change”事件，并将其添加到存储器中。（换句话说，当用户完成绘制每个笔画时，如果用户绘制3笔画，则每次笔画完成后，此事件将发出3次）。

以下是您如何绑定到该事件：

1	`$("#signature").bind('change',` `function(e){` `/* 'e.target' will refer to div with "#signature" */` `})`

로그인 후 복사

事件通过“线程”（setTimeout（...，3））异步发出，因此您不需要将事件处理程序包装到任何类型的“线程”中，因为jSignature小部件将继续执行，并且不会等待你要完成你的自定义事件处理程序逻辑。

个人经验和一个完整的php版本demo

html部分

//jquery.moblie会和jsignature有冲突，不知道是版本问题，还是代码代码冲突
<script src="__PUBLIC__/hplus/js/jquery.min.js"></script>
<script src="__PUBLIC__/sign/jSignature.min.js"></script>
<script src="__PUBLIC__/hplus/js/plugins/pace/pace.min.js"></script>
<!--<script src="__PUBLIC__/hplus/js/bootstrap.min.js?v=3.3.6"></script>-->
<link href="__PUBLIC__/hplus/css/bootstrap.min14ed.css?v=3.3.6" rel="stylesheet">
<script src="__PUBLIC__/hplus/js/plugins/layer/layer.min.js"></script>
 
 
 
<style type="text/css"> 
    .zx11{
        border: 1px;
        border-color: red;
    }
    #signatureparent {
        color:black;
        background-color:darkgrey;
    }
    #signature {
        border: 2px dotted black;
 
    }
 
</style>
 
<div class="container">
    <div id="signatureparent">
        <div id="signature"></div>
    </div>
    <br>
    <button type="button" class="btn btn-primary btn-block" id="save">保存</button>
    <button type="button" class="btn btn-default btn-block" id="clear">清除</button>
</div>
 
<script>
    $(document).ready(function () {
 
        var arguments = {
            width: &#39;100%&#39;,
            height: &#39;300px&#39;,
            cssclass: &#39;zx11&#39;,
            signatureLine: false,//去除默认画布上那条横线
            lineWidth: &#39;5&#39;
        };
        $("#signature").jSignature(arguments);
 
        $(&#39;#clear&#39;).click(function () {
            $("#signature").jSignature("reset");
        });
        $(&#39;#save&#39;).click(function () {
            //标准格式但是base64会被tp框架过滤，所不校验，但是jSignature默认是使用png
            var datapair = $("#signature").jSignature("getData", "image");
            var i = new Image();
            i.src = "data:" + datapair[0] + "," + datapair[1];
            i.image = datapair[1];
            var requestTag;
            requestTag = &#39;{$Think.get.identify}&#39;;
            console.log(i.image);
//            console.log(i.src);
 
            //询问框
            layer.confirm("如果确认无误，请确认<br><img src=" + i.src + " height=&#39;100px&#39; width=&#39;100px&#39; />", {
                btn: [&#39;确认&#39;, &#39;取消&#39;] //按钮
            }, function () {
 
 
                $.ajax({
                    url: "/app.php?m={$Think.MODULE_NAME}&a={$Think.ACTION_NAME}",
                    //dataType: "json",                    contentType: "application/json; charset=utf-8",
                    data: "{\"identify\":\"" + requestTag + "\",\"image_data\":\"" + encodeURIComponent(i.image) + "\"}",//避免base64长度过大，json传输
                    type: "post",
                    cache: false,
                    success: function (msg) {
                        if (msg.code === 1) {
                            layer.msg(&#39;上传成功&#39;);
                        } else {
                            layer.msg(&#39;上传失败,请再次签名！&#39;);
                        }
                    }
                });
            }, function () {
                layer.msg(&#39;取消成功&#39;);
            });
 
 
 
        });
    });
</script>

로그인 후 복사

php部分

$image_data = json_decode(file_get_contents(&#39;php://input&#39;), true); //只能这样接收
$data = rawurldecode($image_data[&#39;image_data&#39;]);
 
$file_name = time().&#39;.png&#39;; //必须png
$a = file_put_contents($file_name, base64_decode($data));

로그인 후 복사

【相关推荐：javascript学习教程、web前端】

위 내용은 jsignature 중국어 개발 튜토리얼의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

본 웹사이트의 성명

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

핫 AI 도구

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

AI 옷 제거제

Video Face Swap

완전히 무료인 AI 얼굴 교환 도구를 사용하여 모든 비디오의 얼굴을 쉽게 바꾸세요!

뜨거운 도구

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

뜨거운 주제

Gmail 이메일의 로그인 입구는 어디에 있나요?

7770

자바 튜토리얼

1644

Cakephp 튜토리얼

1399

라라벨 튜토리얼

1296

PHP 튜토리얼

1234

Related knowledge

jQuery 참조 방법에 대한 자세한 설명: 빠른 시작 가이드 Feb 27, 2024 pm 06:45 PM

jQuery 참조 방법에 대한 자세한 설명: 빠른 시작 가이드 jQuery는 웹 사이트 개발에 널리 사용되는 JavaScript 라이브러리로, JavaScript 프로그래밍을 단순화하고 개발자에게 풍부한 기능을 제공합니다. 이 기사에서는 jQuery의 참조 방법을 자세히 소개하고 독자가 빠르게 시작할 수 있도록 구체적인 코드 예제를 제공합니다. jQuery 소개 먼저 HTML 파일에 jQuery 라이브러리를 도입해야 합니다. CDN 링크를 통해 소개하거나 다운로드할 수 있습니다.

jQuery에서 PUT 요청 방법을 사용하는 방법은 무엇입니까? Feb 28, 2024 pm 03:12 PM

jQuery에서 PUT 요청 방법을 사용하는 방법은 무엇입니까? jQuery에서 PUT 요청을 보내는 방법은 다른 유형의 요청을 보내는 것과 유사하지만 몇 가지 세부 사항과 매개 변수 설정에 주의해야 합니다. PUT 요청은 일반적으로 데이터베이스의 데이터 업데이트 또는 서버의 파일 업데이트와 같은 리소스를 업데이트하는 데 사용됩니다. 다음은 jQuery에서 PUT 요청 메소드를 사용하는 구체적인 코드 예제입니다. 먼저 jQuery 라이브러리 파일을 포함했는지 확인한 다음 $.ajax({u를 통해 PUT 요청을 보낼 수 있습니다.

jQuery 팁: 페이지에 있는 모든 태그의 텍스트를 빠르게 수정하세요. Feb 28, 2024 pm 09:06 PM

제목: jQuery 팁: 페이지에 있는 모든 태그의 텍스트를 빠르게 수정하세요. 웹 개발에서는 페이지의 요소를 수정하고 조작해야 하는 경우가 많습니다. jQuery를 사용할 때 페이지에 있는 모든 태그의 텍스트 내용을 한 번에 수정해야 하는 경우가 있는데, 이는 시간과 에너지를 절약할 수 있습니다. 다음은 jQuery를 사용하여 페이지의 모든 태그 텍스트를 빠르게 수정하는 방법을 소개하고 구체적인 코드 예제를 제공합니다. 먼저 jQuery 라이브러리 파일을 도입하고 다음 코드가 페이지에 도입되었는지 확인해야 합니다. &lt

jQuery를 사용하여 요소의 높이 속성을 제거하는 방법은 무엇입니까? Feb 28, 2024 am 08:39 AM

jQuery를 사용하여 요소의 높이 속성을 제거하는 방법은 무엇입니까? 프런트엔드 개발에서는 요소의 높이 속성을 조작해야 하는 경우가 종종 있습니다. 때로는 요소의 높이를 동적으로 변경해야 할 수도 있고 요소의 높이 속성을 제거해야 하는 경우도 있습니다. 이 기사에서는 jQuery를 사용하여 요소의 높이 속성을 제거하는 방법을 소개하고 구체적인 코드 예제를 제공합니다. jQuery를 사용하여 높이 속성을 연산하기 전에 먼저 CSS의 높이 속성을 이해해야 합니다. height 속성은 요소의 높이를 설정하는 데 사용됩니다.

jQuery를 사용하여 모든 태그의 텍스트 내용 수정 Feb 28, 2024 pm 05:42 PM

제목: jQuery를 사용하여 모든 태그의 텍스트 내용을 수정합니다. jQuery는 DOM 작업을 처리하는 데 널리 사용되는 인기 있는 JavaScript 라이브러리입니다. 웹 개발을 하다 보면 페이지에 있는 링크 태그(태그)의 텍스트 내용을 수정해야 하는 경우가 종종 있습니다. 이 기사에서는 jQuery를 사용하여 이 목표를 달성하는 방법을 설명하고 구체적인 코드 예제를 제공합니다. 먼저 페이지에 jQuery 라이브러리를 도입해야 합니다. HTML 파일에 다음 코드를 추가합니다.

jQuery에서 eq의 역할 및 적용 시나리오 이해 Feb 28, 2024 pm 01:15 PM

jQuery는 웹 페이지에서 DOM 조작 및 이벤트 처리를 처리하는 데 널리 사용되는 인기 있는 JavaScript 라이브러리입니다. jQuery에서 eq() 메서드는 지정된 인덱스 위치에서 요소를 선택하는 데 사용됩니다. 구체적인 사용 및 적용 시나리오는 다음과 같습니다. jQuery에서 eq() 메서드는 지정된 인덱스 위치에 있는 요소를 선택합니다. 인덱스 위치는 0부터 계산되기 시작합니다. 즉, 첫 번째 요소의 인덱스는 0이고 두 번째 요소의 인덱스는 1입니다. eq() 메소드의 구문은 다음과 같습니다: $("s

jQuery 요소에 특정 속성이 있는지 어떻게 알 수 있나요? Feb 29, 2024 am 09:03 AM

jQuery 요소에 특정 속성이 있는지 어떻게 알 수 있나요? jQuery를 사용하여 DOM 요소를 조작할 때 요소에 특정 속성이 있는지 확인해야 하는 상황이 자주 발생합니다. 이 경우 jQuery에서 제공하는 메소드를 사용하여 이 기능을 쉽게 구현할 수 있습니다. 다음은 jQuery 요소에 특정 속성이 있는지 확인하기 위해 일반적으로 사용되는 두 가지 방법을 특정 코드 예제와 함께 소개합니다. 방법 1: attr() 메서드와 typeof 연산자를 // 사용하여 요소에 특정 속성이 있는지 확인

jQuery를 사용하여 테이블에 새 행을 추가하는 방법 소개 Feb 29, 2024 am 08:12 AM

jQuery는 웹 개발에 널리 사용되는 인기 있는 JavaScript 라이브러리입니다. 웹 개발 중에 JavaScript를 통해 테이블에 새 행을 동적으로 추가해야 하는 경우가 많습니다. 이 기사에서는 jQuery를 사용하여 테이블에 새 행을 추가하는 방법을 소개하고 특정 코드 예제를 제공합니다. 먼저 HTML 페이지에 jQuery 라이브러리를 도입해야 합니다. jQuery 라이브러리는 다음 코드를 통해 태그에 도입될 수 있습니다.

See all articles

설명	기본값
캔버스 너비를 정의합니다. % 또는 px 값이 없습니다(새 버전에서는 백분율 및 px 접미사를 사용할 수 있음)	250
은 캔버스의 높이를 정의합니다. % 또는 px 값이 없습니다(새 버전에서는 백분율 및 px 접미사를 사용할 수 있음)	150
은 캔버스의 획 색상을 정의합니다. 모든 색상 16진수 값을 허용합니다.	#000
캔버스의 배경색을 정의합니다. 모든 색상의 16진수 값을 허용합니다.	#fff
는 선의 두께를 정의합니다. 양수 값(기본 캔버스 가로선의 브러시 너비도 포함)을 허용합니다.	1
캔버스를 정의하는 사용자 정의 CSS 클래스	None

jsignature 중국어 개발 튜토리얼

핫 AI 도구

Undresser.AI Undress

AI Clothes Remover

Undress AI Tool

Clothoff.io

Video Face Swap

인기 기사

뜨거운 도구

메모장++7.3.1

SublimeText3 중국어 버전

스튜디오 13.0.1 보내기

드림위버 CS6

SublimeText3 Mac 버전

뜨거운 주제