基于％

Question

要显示的图像阵列我有一个带有％的表格，我需要运行一系列图像并根据％显示正确的图像。所以，在td.tri-img中，如果是20％，那么我需要使用jquery来拉动triangle20.png。

编辑：所以我有这个现在，这个JS，但我不能这样做更有效率，通过TD的循环，并在跨???拉：

function triangleImages() { 
var _td = $('td#tri-first'); 
    var _percentage = $('td#tri-first span').html(); 
    //get the img element 
    var _img = $('img#column1'); 
    //generate new source for img 
    var _img_src = 'img/triangle' + _percentage + '.png'; 
    //set the src 
    _img.attr('src', _img_src); 
    } 
    triangleImages(); 

这里是表：

  <tr class="tri-col"> 
      <td class="num-label">20</td> 
      <td class="tri-img" id="tri-first"><img class="one" id="column1" src="" alt="" ><span>20</span></td> 
      <td class="tri-img"><img class="two" src="" alt="" ><span>30</span><span>&#37;</span></td> 
      <td class="tri-img"><img class="three" src="" alt="" ><span>40</span><span>&#37;</span></td> 
      <td class="tri-img"><img class="four" src="" alt="" ><span>35</span><span>&#37;</span></td> 
      <td class="tri-img"><img class="five" src="" alt="" ><span>23</span><span>&#37;</span></td> 
      <td class="tri-img"><img class="six" src="" alt="" ><span>22</span><span>&#37;</span></td> 
      <td class="tri-img"><img class="seven" src="" alt="" ><span>50</span><span>&#37;</span></td> 
      <td class="tri-img"><img class="eight" src="img/triangle.png" alt="" ><span></span><span>&#37;</span></td> 
      <td class="tri-img"><img class="nine" src="img/triangle.png" alt="" ><span></span><span>&#37;</span></td> 
     </tr> 

Answer 1

你看这个：

var _tds = jQuery('td.tri-img'); 

可以使用jQuery.each在_tds，然后使用jQuery（ '独特-TD'）的孩子仁（“跨度”）。HTML（）来获得

//get the td element 
var _td = jQuery('#td_id'); 
var _width = _td.attr('width'); 
//remove % from width 
var _width = _width.substr(0, _width.length - 1); 
//get the img element 
var _img = jQuery('#img_id'); 
//generate new source for img 
var _img_src = 'img/triangle' + _width + '.png'; 
//set the src 
_img.attr('src', _img_src);