[英]How I use onClick in jquery?
我是jquery的新手,对此我不太了解,但是我一直在尝试使用jquery从HTML生成Excel和PDF。 为此,我使用以下代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Assignment to generate excel</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script src="~/Contents/jquery-1.9.1.js"></script>
<script src="~/tableExport/tableExport.js"></script> <!-- @*Main file which does export feature *@ -->
<script src="~/tableExport/jquery.base64.js"></script> <!-- @*Main file which does convert the content to base64 *@ -->
<script src="~/tableExport/html2canvas.js"></script> <!-- @*Main file which does export to image feature *@ -->
<script src="~/tableExport/jspdf/libs/base64.js"></script> <!-- @*Main file which does convert the content to base64 for pdf *@ -->
<script src="~/tableExport/jspdf/libs/sprintf.js"></script> <!-- @*Main file which does export feature for pdf *@ -->
<script src="~/tableExport/jspdf/jspdf.js"></script> <!-- @*Main file which does export feature for pdf *@ -->
</head>
<body>
<table id="activity" border="1" width="50%" >
<tr>
<th>Country</th>
<th>Population</th>
<th>Date</th>
<th>%ge</th>
</tr>
<tr>
<td>Chinna</td>
<td>1,363,480,000</td>
<td>March 24, 2014</td>
<td>19.1</td>
</tr>
<tr>
<td>India</td>
<td>1,241,900,000</td>
<td>March 24, 2014</td>
<td>17.4</td>
</tr>
<tr>
<td>United States</td>
<td>317,746,000</td>
<td>March 24, 2014</td>
<td>4.44</td>
</tr>
<tr>
<td>Indonesia</td>
<td>249,866,000</td>
<td>July 1, 2013</td>
<td>3.49</td>
</tr>
<tr>
<td>Brazil</td>
<td>201,032,714</td>
<td>July 1, 2013</td>
<td>2.81</td>
</tr>
</table>
onClick ="$('#activity').tableExport({type:'pdf',escape:'false'});"
<script>
$(document).ready(function () {
$('#exportexcel').bind('click', function (e) {
$('#activity').tableExport({ type: 'excel', escape: 'false' });
});
$('#exportpdf').bind('click', function (e) {
$('#activity').tableExport({ type: 'pdf', escape: 'false' });
});
$('#exportimage').bind('click', function (e) {
$('#activity').tableExport({ type: 'png', escape: 'false' });
});
$('#exportcsv').bind('click', function (e) {
$('#activity').tableExport({ type: 'csv', escape: 'false' });
});
$('#exportppt').bind('click', function (e) {
$('#activity').tableExport({ type: 'powerpoint', escape: 'false' });
});
$('#exportxml').bind('click', function (e) {
$('#activity').tableExport({ type: 'xml', escape: 'false' });
});
$('#exportword').bind('click', function (e) {
$('#activity').tableExport({ type: 'doc', escape: 'false' });
});
$('#exporttxt').bind('click', function (e) {
$('#activity').tableExport({ type: 'txt', escape: 'false' });
});
});
</script>
</body>
</html>
但是当我在浏览器中运行此代码时,我得到以下输出
我不知道如何在这种情况下使用onClick事件,因此当我单击Export excel或Export PDF按钮时,会生成此文件。
如果有人对此有任何想法,请帮助我。
提前致谢。
onclick
是一个HTML属性,需要与元素的标签一起使用,例如table
标签上的border
或id
。 单击应用到该元素的元素后,它将运行其中的代码。
要实现所需的功能,您需要添加一个按钮并将onclick
属性放在该按钮上,如下所示:
<button onclick="$('#activity').tableExport({type:'pdf',escape:'false'});">Export</button>
此方法产生的输出如下所示:
另一种执行此操作的方法(以及通常执行此操作的方法)是在script
标签内使用jQuery的on
函数。 为此,请将以下内容放在$(document).ready
回调的底部:
$("button").on("click", function() {
$('#activity').tableExport({type:'pdf',escape:'false'});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.