NaN的Javascript问题

时间:2017-05-18 11:11:23

标签: javascript

我是js的初学者,当有人修改数量并计算列总数时,有人帮我制作了一个js代码来计算列。这段代码工作正常但不适用于2件事。当字段是" nc"这样的文本时,我得到结果NaN。 (html例子的第26行,它也可以是其他文本)但是我需要字段中显示的文本,当默认值是十进制数时(如0,9行20) html例子)。如何修改代码以解决这两个选项?



(function() {
  let table = document.querySelector('#nutrition')
  let tBodyElems = table.querySelector('tbody')
  let trElems = [...tBodyElems.querySelectorAll('tr')].map(tr => {
    let td = [...tr.querySelectorAll('td')]
    td.input = tr.querySelector('input')
    td.tr = tr
    return td
  })

  let tFoot = table.querySelector('tfoot')
  let tFootTd = [...tFoot.querySelectorAll('td')]

  const updateTotal = function() {
    tFootTd.forEach((tdFoot, i) => {
      if (i === 0) {
        return
      }
      if (i === 1) {
        let total = trElems.reduce((a, e) => {
          return a + (parseInt(e.input.value))
        }, 0)
        tdFoot.textContent = total
      } else {
        let total = trElems.reduce((a, e) => {
          return a + (parseFloat(e[i].dataset.curValue) || parseFloat(e.input))
        }, 0)
        tdFoot.textContent = Math.ceil(total * 1000) / 1000
      }
    })
  }
  const updateRow = function(trElement) {
    let value = parseFloat(trElement.input.value.replace(',', '.'))
    if (value === NaN) {
      return
    }

    [...trElement].splice(2).forEach(e => {
      let newValue = Math.ceil(parseFloat(e.dataset.for100) * value) / 100
      e.textContent = newValue
      e.dataset.curValue = newValue
    })
  }
  const updateAll = function() {
    trElems.forEach(updateRow)
    updateTotal()
  }
  const debounce = function(func, wait, immediate) {
    var timeout;
    return function() {
      var context = this,
        args = arguments;
      var later = function() {
        timeout = null;
        if (!immediate) func.apply(context, args);
      };
      var callNow = immediate && !timeout;
      clearTimeout(timeout);
      timeout = setTimeout(later, wait);
      if (callNow) func.apply(context, args);
    };
  };
  window.addEventListener('DOMContentLoaded', updateAll)
  trElems.forEach(tr => {
    tr.input.addEventListener('keydown', debounce(() => {
      updateRow(tr), updateTotal()
    }, 250))
  })
})()

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container">
  <div class="container">
    <div class="row col-md-offset-2 col-md-14">
      <table class="table table-striped" id="nutrition">
        <thead>
          <tr>
            <th>Aliments</th>
            <th>Poids (Gr)</th>
            <th>Energie kJ</th>
            <th>Energie kcal</th>
            <th>Proteines</th>
        </thead>
        <tbody class="text-primary">
          <tr>
            <td>Pain grillé, domestique:</td>
            <td><input type="text" value="20gr"></td>
            <td data-for100="1430">1430</td>
            <td data-for100="336">336</td>
            <td data-for100="0,9">0,9</td>
          </tr>
          <tr>
            <td>Cabillaud, cuit à la vapeur:</td>
            <td><input type="text" value="40gr"></td>
            <td data-for100="350">350</td>
            <td data-for100="nc">nc</td>
            <td data-for100="18.6">18,6</td>
          </tr>
        </tbody>
        <tfoot>
          <td>Total</td>
          <td><strong>60gr</strong></td>
          <td data-for100="350">350</td>
          <td data-for100="82.7">82,7</td>
          <td data-for100="18.6">18,6</td>
        </tfoot>
      </table>
    </div>
  </div>
</div>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

将您的语句gg <- ggplot(data, aes(animals)) + geom_histogram(aes(fill = as.factor(healthy)), stat = "count") gg + geom_text(aes(y = y, label = count), data = tabDatY) + geom_text(aes(y = y.sum + .2, label = paste0(round(perc * 100), "%")), data = tabDatY %>% filter(healthy == 1)) 替换为if (value === NaN) { ... }