Question

我仍然对这个JavaScript事情不熟悉，并尝试使用 HTML ， PHP 和 JavaScript 执行某些操作。

所以我有一张表来显示数据库中的估计劳动力，以及我应该输入的实际劳动力，我在这里尝试的是获得估算劳动力和实际劳动力之间的差距

就像这样：

=============================================== =============

estLabor || realLabor ||差距||之所以存在差距

=============================================== =============

公式为estLabor - realLabor = laborGap。

我必须完成的是失败，这是代码：

在表单开始之前

一些PHP：

<?php
$sqlReport = mysqli_query($con, "SELECT * FROM `recordProd` WHERE `force_flag` = 1");
while($row = mysqli_fetch_array($sqlReport, MYSQLI_ASSOC)){
    $estLabor = $row['labor_estimation'];
?>

HTML ：

<tr>
    <td>Labor</td>
    <td id="estLabor"></td>
    <td><input type="text" name="laborInput" id="realLabor"></td>
    <td><span class="gaps laborGap"></span></td>
    <td><textarea name="reasonLabor"></textarea></td>
</tr>

的JavaScript ：

<script>
var estLabor = <?php echo $estLabor; ?>;
var realLabor = document.getElementById("realLabor").value;
$("#estLabor").html(estLabor);

$(document).ready(function() {
    $('input#realLabor').keyup(function() {
        var a = $('td#estLabor').val();
        var b = $('input#realLabor').val();
        $('span.laborGap').text(a - b);
        console.log('var a = ', a, ' var b = ', b);
    });
});
</script>

我从控制台获得的东西是

var a = var b = 3

问题很简单，怎么做？从数据库中检索并在精确的时间内进行数学运算我将数字放在 TextField 中，并获得了employeeGap范围的结果。

Answer 1

可能你在减法方面出错了，

你可以对你的公式做这样的事情：

      $( "#a" ).keyup(function() {
      var a = $('#a').val();
      var b = $('#b').val();
      var c = parseInt(b) - parseInt(a);
      $('#c').val(c);
     });

有关详情，您可以查看我的JS Fiddle Example

Answer 2

td没有任何值，它是全文。所以使用textContent而不是val

在外部函数中描述变量：

var estLaborVal = document.getElementById("estLabor").textContent;

并修复函数内的变量：

$(document).ready(function() {
    $('input#realLabor').keyup(function() {
        var a = estLaborVal;
        var b = $('input#realLabor').val();
        $('span.laborGap').text(a - b);
        console.log('var a = ', a, ' var b = ', b);
    });
});

它做得很好，对于@Teemu

Answer 3

您正在混合使用JavaScript和JQuery，因此这里有一个完整的JQuery函数可以帮助您。

您可以将$estLabor变量放在<label>这样的

中

＆＃13;

$(document).ready(function() {
    $('#realLabor').keyup(function() {
        var a = $('#estLabor').text();
        var b = $('#realLabor').val();
        $('span.laborGap').text(a - b);
        console.log('var a = ', a, ' var b = ', b);
    });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<tr>
  <td>Labor</td>
  <td>
    <label id="estLabor">
      10 <!-- Put <?php echo $estLabor; ?> here -->
    </label>
  </td>
  <td>
    <input type="text" name="laborInput" id="realLabor">
  </td>
  <td><span class="gaps laborGap"></span></td>
  <td>
    <textarea name="reasonLabor"></textarea>
  </td>
</tr>

＆＃13;

使用php检索回显数据库，并使用keyup函数进行一些数学运算

3 个答案: