jQWidgets是一個 JavaScript 框架,用於為 PC 和移動設備製作基於 Web 的應用程序。它是一個非常強大、優化、獨立於平台且得到廣泛支持的框架。這jqx二維碼位於 jQWidgets 版本 14 中,用於指示可以顯示 QR 碼並擁有 API 以便批準、導出和個性化它們的小部件。
export()方法用於導出顯示的jqxQRcode。
用法:
$('Selector').jqxQRcode("export", "format", "fileName");
參數:
- format:這是導出文件時指定的格式。例如,SVG、png 或 jpg。它是字符串類型。
- fileName:它是要導出的文件的指定名稱。它是字符串類型。
返回類型:該方法不返回任何內容。
鏈接文件:下載jQWidgets從給定的鏈接。在 HTML 文件中,找到下載文件夾中的腳本文件。
<link rel=”stylesheet” href=”jqwidgets/styles/jqx.base.css” type=”text/css” />
<script type=”text/javascript” src=”scripts/jquery-1.11.1.min.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqxcore.js”></script>
<script type=”text/javascript” src=”jqwidgets/jqxqrcode.js”> </script>
<script type=”text/javascript” src=”jqwidgets/jqxbuttons.js”> </script>
示例 1:下麵的例子說明了jqxQRcodeexport()jQWidgets 中的方法。
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet"
href="jqwidgets/styles/jqx.base.css"
type="text/css" />
<script type="text/javascript" src=
"scripts/jquery-1.11.1.min.js">
</script>
<script type="text/javascript"
src="jqwidgets/jqxcore.js">
</script>
<script type="text/javascript"
src="jqwidgets/jqxqrcode.js">
</script>
<script type="text/javascript"
src="jqwidgets/jqxbuttons.js">
</script>
</head>
<body>
<center>
<h1 style="color:green">
GeeksforGeeks
</h1>
<h3>
jQWidgets jqxQRcode export() method
</h3>
<div id="jqxq"></div>
<input type="button" style="margin:29px;"
id="jqxbtn" value="Click here" />
<div id="log"></div>
</center>
<script type="text/javascript">
$(document).ready(function () {
$("#jqxq").jqxQRcode({
value: "gfg",
});
$("#jqxbtn").jqxButton({
width: 280
});
$("#jqxbtn").on("click", function () {
$('#jqxq').jqxQRcode('export', "svg", "Gfg");
$('#log').text("File exported to svg!");
});
});
</script>
</body>
</html>
輸出:
示例 2:下麵是jqxQRcode的另一個例子export()jQWidgets 中的方法。
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet"
href="jqwidgets/styles/jqx.base.css"
type="text/css" />
<script type="text/javascript" src=
"scripts/jquery-1.11.1.min.js">
</script>
<script type="text/javascript"
src="jqwidgets/jqxcore.js">
</script>
<script type="text/javascript"
src="jqwidgets/jqxqrcode.js">
</script>
<script type="text/javascript"
src="jqwidgets/jqxbuttons.js">
</script>
</head>
<body>
<center>
<h1 style="color:green">
GeeksforGeeks
</h1>
<h3>
jQWidgets jqxQRcode export() method
</h3>
<div id="jqxq"></div>
<input type="button" style="margin:29px;"
id="jqxbtn" value="Click here" />
<div id="log"></div>
</center>
<script type="text/javascript">
$(document).ready(function () {
$("#jqxq").jqxQRcode({
value: "gfg",
});
$("#jqxbtn").jqxButton({
width: 280
});
$("#jqxbtn").on("click", function () {
var format = null;
var e = $('#jqxq').jqxQRcode('export', format, "gfg");
if (format === null) {
$('#log').text("Null!");
}
else {
$('#log').text("Not null!");
}
});
});
</script>
</body>
</html>
輸出:
相關用法
- jQWidgets jqxQRcode embedImage屬性用法及代碼示例
- jQWidgets jqxQRcode errorLevel屬性用法及代碼示例
- jQWidgets jqxQRcode labelPosition屬性用法及代碼示例
- jQWidgets jqxQRcode value屬性用法及代碼示例
- jQWidgets jqxQRcode labelFontSize屬性用法及代碼示例
- jQWidgets jqxQRcode getDataURLAsync()用法及代碼示例
- jQWidgets jqxQRcode lineColor屬性用法及代碼示例
- jQWidgets jqxQRcode labelMarginBottom屬性用法及代碼示例
- jQWidgets jqxQRcode isValid()用法及代碼示例
- jQWidgets jqxQRcode imageWidth屬性用法及代碼示例
- jQWidgets jqxQRcode displayLabel屬性用法及代碼示例
- jQWidgets jqxQRcode labelColor屬性用法及代碼示例
- jQWidgets jqxQRcode imageHeight屬性用法及代碼示例
- jQWidgets jqxQRcode backgroundColor屬性用法及代碼示例
- jQWidgets jqxQRcode squareWidth屬性用法及代碼示例
- jQWidgets jqxQRcode labelFont屬性用法及代碼示例
- jQWidgets jqxQRcode labelMarginTop屬性用法及代碼示例
- jQWidgets jqxQRcode getDataURL()用法及代碼示例
- jQWidgets jqxQRcode renderAs屬性用法及代碼示例
- jQWidgets jqxCalendar val()用法及代碼示例
- jQWidgets jqxCalendar destroy()用法及代碼示例
- jQWidgets jqxCalendar clear()用法及代碼示例
- jQWidgets jqxCalendar value屬性用法及代碼示例
- jQWidgets jqxCalendar titleFormat屬性用法及代碼示例
- jQWidgets jqxCalendar theme屬性用法及代碼示例
注:本文由純淨天空篩選整理自nidhi1352singh大神的英文原創作品 jQWidgets jqxQRcode export() Method。非經特殊聲明,原始代碼版權歸原作者所有,本譯文未經允許或授權,請勿轉載或複製。