[英]append $ in html table in specific column in jquery
I have a html table tbl1 I have 3 column which is generated in json response.我有一个 html 表 tbl1 我有 3 列在 json 响应中生成。 ID count and value.I want to append $ in value column in tbody
ID 计数和值。我想在 tbody 的值列中 append $
$('#tbl1 tbody tr').each(function(){ console.log($('td:nth-child(3)').text().prepend('$')); });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table id="tbl1"> <thead> <tr class="hidden1"><th data-style="Header" style="background-color: #66cdf2; color: #000">Opportunity</th> <th data-style="Header" style="background-color: #66cdf2; color: #000">Pipeline Count</th> <th data-style="Header" style="background-color: #66cdf2; color: #000">Pipeline Value</th> </tr> </thead> <tbody> <tr> <td>Proposal Submitted</td> <td>61</td> <td>25818992</td> // $25818992 </tr> <tr> <td>Total</td> <td>61</td> <td>25818992</td> //$25818992 </tr> </tbody> </table>
No need to loop无需循环
You cannot prepend to a string您不能添加到字符串
Here I am using the text function这里我使用的是文本 function
$('#tbl1 tbody tr td:nth-child(3)').text(function() { return '$'+this.textContent });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table id="tbl1"> <thead> <tr class="hidden1"><th data-style="Header" style="background-color: #66cdf2; color: #000">Opportunity</th> <th data-style="Header" style="background-color: #66cdf2; color: #000">Pipeline Count</th> <th data-style="Header" style="background-color: #66cdf2; color: #000">Pipeline Value</th> </tr> </thead> <tbody> <tr> <td>Proposal Submitted</td> <td>61</td> <td>25818992</td> <!-- $25818992 --> </tr> <tr> <td>Total</td> <td>61</td> <td>25818992</td> <!-- $25818992 --> </tr> </tbody> </table>
No need to use javascript
or jquery
for that.无需为此使用
javascript
或jquery
。 You can achieve that by adding simple CSS like this:您可以通过添加简单的 CSS 来实现,如下所示:
td.dollar:before { content: "$"; }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table id="tbl1"> <thead> <tr class="hidden1"> <th data-style="Header" style="background-color: #66cdf2; color: #000">Opportunity</th> <th data-style="Header" style="background-color: #66cdf2; color: #000">Pipeline Count</th> <th data-style="Header" style="background-color: #66cdf2; color: #000">Pipeline Value</th> </tr> </thead> <tbody> <tr> <td>Proposal Submitted</td> <td>61</td> <td class="dollar">25818992</td> </tr> <tr> <td>Total</td> <td>61</td> <td class="dollar">25818992</td> </tr> </tbody> </table>
You can use the text(function)
method as follows:您可以按如下方式使用
text(function)
方法:
$('#tbl1 tbody tr td:nth-child(3)').text(function() { return '$' + $(this).text(); });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <table id="tbl1"> <thead> <tr class="hidden1"><th data-style="Header" style="background-color: #66cdf2; color: #000">Opportunity</th> <th data-style="Header" style="background-color: #66cdf2; color: #000">Pipeline Count</th> <th data-style="Header" style="background-color: #66cdf2; color: #000">Pipeline Value</th> </tr> </thead> <tbody> <tr> <td>Proposal Submitted</td> <td>61</td> <td>25818992</td> // $25818992 </tr> <tr> <td>Total</td> <td>61</td> <td>25818992</td> //$25818992 </tr> </tbody> </table>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.