将动态生成的条形码图像附加到先前生成的图像

时间:2014-09-30 08:25:32

标签: jquery append barcode dynamically-generated

我正在为所选行生成条形码图像,但最后,只显示最后一张图像,任何人都可以帮我将以前生成的图像附加到当前生成的图像。

<!DOCTYPE html>
<html>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" src="http://www.jqueryscript.net/demo/Simple-jQuery-Based-Barcode-Generator-Barcode/jquery-barcode.js "></script>
<head>
<style>
table, td {
border: 1px solid black;
}
</style>
</head>
<script language="javascript">
function generateBarcode() {   
var settings = {
output:'css',
bgColor: '#FFFFFF',
color: '#000000',
barWidth: '1',
barHeight: '50',
moduleSize: '5',
posX: '10',
posY: '20',
addQuietZone: '1'
};  
var tbl = document.getElementById("myDynamicTableBody");
if (tbl != null) {          
for (var i = 0; i <= tbl.rows.length-1; i++) {
var checkid = 'ck'+i;                   
var checkbox = document.getElementById(checkid);                    
if(checkbox.checked){                                                               
var val = tbl.rows[i].cells[0].innerHTML;           
alert(tbl.rows[i].cells[0].innerHTML);
alert(val);                 
//show the barcode for each selected row
$("#overlay").barcode(val, "code11", settings);                                     
}                   
}
}
}
</script> 
<body>
<hr/>
<div id="overlay"> </div>
<hr/>
<table class="table table-bordered" id="myDynamicTable">
<thead>
<tr><th>Reward ID</th>
<th>Issue Date</th>
<th>Expiration Date</th>
<th>Amount</th>
<th>Select</th>
<tr>
</thead>
<tbody id="myDynamicTableBody">
<tr>
<td>1234567891</td>
<td>9/22/2013</td>
<td>12/05/2015</td>
<td>$5.00</td>
<td><input type="checkbox" class="tcbox" id="ck0" checked="checked"></td>
</tr>
<tr>
<td>1234567892</td>
<td>9/22/2013</td>
<td>12/05/2015</td>
<td>$5.00</td>
<td><input type="checkbox" class="tcbox" id="ck1" checked="checked"></td>
</tr>
<tr>
<td>1234567893</td>
<td>9/22/2013</td>
<td>12/05/2015</td>
<td>$5.00</td>
<td><input type="checkbox" class="tcbox" id="ck2" checked="checked"></td>
</tr>
<tr>
<td>1234567894</td>
<td>9/22/2013</td>
<td>12/05/2015</td>
<td>$5.00</td>
<td><input type="checkbox" class="tcbox" id="ck3" checked="checked"></td>
</tr>
<tr>
<td>1234567895</td>
<td>9/22/2013</td>
<td>12/05/2015</td>
<td>$5.00</td>
<td><input type="checkbox" class="tcbox" id="ck4" checked="checked"></td>
</tr>
</tbody>
</table>
<input type="button" value="print selected" onclick="generateBarcode()">
</body>
</html>

0 个答案:

没有答案