Question

我的桌子上有三个td。其中两个是输入，我乘以并吐出第三个td的答案。我最初在那个td中有一个跨度，但是我需要一个输入框。使用span可以很好地工作，但是一旦我输入了就不能了。

如何使用这个小的Jquery函数在输入值和跨度中显示结果？

这是td：

 <td> @* 11 *@
   <span class="mcalPremium"></span> //Multiplied answer goes here, but want it in the TB instead
     @*<input type="number"  class="form-control mcalPremium" />*@//Commented out to try both.
 </td>

以下是函数：

$("#alSublineValSubmitTBL").on('input', 'td:nth-child(11)', function () {
  var td = $(this);
  var input1 = +td.find('input').val() || 0;
  var input2 = +td.parent().find("td:nth-child(9) input").val() || 0;

  var exp = parseInt(input1);
  var rate = parseFloat(input2);
  var premium = rate * exp;

  //display premium in premium field
  td.parent().find('.mcalPremium').text('$' + premium).digits();
  //td.parent().find('.mcalPremium').val('$' + premium).digits();
});

编辑和更新：该错误隐藏在许多我只是想念的console.out部分之中。 .val实际上可以按照我的想法运行，但是我在val（）“ val（'$'+ premium）”中插入了美元符号，从而导致了错误。删除它可以解决问题，并且可以根据需要运行。

Answer 1

<input>节点中的值是通过其value属性而不是通过其内容（例如，在<span>或<div>中）来访问的。

相应的jQuery方法是.val()。

Answer 2

使用jQuery中的.val来访问和写入输入，例如：

$( document ).ready(function(){
  $('.print').click(function(){
    $('#display').append($('input').val()+"<br>");
  });
  $('.add').click(function(){
    $('input').val('set content')
  });
});

div{
  border: 1px solid black;
  display: inline-block;
  cursor: pointer;
  padding: 2px;
}

#display{
  margin-top: 2px;
  height: 200px;
  width: 200px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<body>
  <input></input>
  <div class="button add">Set Text</div>
  <div class="button print">Print Text</div><br>
  <div id="display"></div>
</body>

Answer 3

虽然大家都正确地说.val（）是要使用的正确资源，但@EGC才将我推向正确的方向。非常感激。我正在使用.val，但是其中包含一些错误的文本，导致错误被掩埋在我正在使用的许多其他console.log（）中。

固定答案：

<td> @* 11 *@
 <input type="number"  class="form-control mcalPremium" />
</td>

$("#alSublineValSubmitTBL").on('input', 'td:nth-child(11)', function () {
  var td = $(this);
  var input1 = +td.find('input').val() || 0;
  var input2 = +td.parent().find("td:nth-child(9) input").val() || 0;

  var exp = parseInt(input1);
  var rate = parseFloat(input2);
  var premium = rate * exp;

 //display premium in premium field
  td.parent().find('.mcalPremium').val(premium).digits();//Fix
});

如何用值而不是使用跨度填充输入文本框？

3 个答案: