根据之前的课程多次添加条形码

时间:2011-06-10 02:18:25

标签: javascript jquery barcode

我有一个数字列表,我需要自动将它们变成一个条形码。我可以让第一个改变,但我不能得到改变后的那些。我有一个jquery条形码生成器。我对此很新。请帮忙。

<table width=180 border=0 cellpadding=0 cellspacing=0>
  <tr> 
    <td class="barcode_needed">10133</td>
  </tr>
  <tr> 
    <td class="barcode_needed">20133</td>
  </tr>
  <tr> 
    <td class="barcode_needed">30133</td>
  </tr>
</table>


<link rel="stylesheet" type="text/css" href="http://barcode-coder.com/css/style.css?ft=1298939919" />
<script type="text/javascript" src="http://barcode-coder.com/js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="http://barcode-coder.com/js/jquery-ui-1.7.custom.min.js"></script>
<script type="text/javascript" src="http://barcode-coder.com/js/jquery-barcode-last.min.js"></script>


<script>
  $("td.barcode_needed").after("<div id='bcTarget1'>");
  $("#bcTarget1").barcode(('G' + $("td.barcode_needed").html()), "code128");
</script>

1 个答案:

答案 0 :(得分:3)

您的问题是您正在创建具有相同<div>属性的多个id元素。当你这样做时:

$("#bcTarget1")

jQuery只会找到第一个,所以你只能获得一个条形码。您也是通过插入<div>作为<tr>的孩子来混合您的元素。

首先,修复HTML结构(包括重复的id属性):

$('td.barcode_needed').append('<div class="bcTarget">');

这会将您的<div>置于<td>内(以便您的元素嵌套正确),并将id属性替换为class

然后,通过引用下一个结构来修复条形码。

$('.bcTarget').each(function() {
    var $this = $(this);
    $this.barcode(
        'G' + $this.closest('td.barcode_needed').text(),
        'code128'
    );
});

closest调用上升到树中以找到与选择器匹配的最近祖先。您可以在找到的表格单元格上使用text,因为当您致电<div>时,您刚添加的.text仍为空。

实例:http://jsfiddle.net/ambiguous/eaYTZ/

你可能想要尝试一下造型。