javascript - jQuery keyup 事件未获取正确的值

Question

我有一个动态生成的 HTML 表单。该表单包含一个输入字段和一个隐藏输入字段。因此，它动态生成的次数取决于用户。输入字段的 ID 和名称也是动态设置的。当用户在输入框中键入内容时，我依靠类从输入字段中获取值。

这是我的 html 表单的静态代码

<div id="choose_subjects_div2" class="form-group" >
   <div class="col-md-6">
      <input type="hidden" class="form-control onesubject" id="subj_1" name="subj_1" value="8">
      <input type="number" class="form-control onetotal" id="tot_1" name="tot_1">
   </div>
   <p></p>
   <div class="col-md-6">
      <input type="hidden" class="form-control onesubject" id="subj_2" name="subj_1" value="5">
      <input type="number" class="form-control onetotal" id="tot_2" name="tot_1" ">
   </div>
   <p></p>
</div>

我想要输入字段的值和与其关联的隐藏字段来执行一些数据库操作。

这是我正在使用的 jQuery。

var delay = (function(){
  var timer = 0;
  return function(callback, ms){
  clearTimeout (timer);
  timer = setTimeout(callback, ms);
 };
})();

$('.onetotal').keyup(function() {
  delay(function(){
      var xxx=$('.onetotal').val();
      var hiddenx = $('.onetotal').siblings('.onesubject').attr('value');
    alert(xxx +'and' +hiddenx );
  }, 1000 );
});

keyup 事件在延迟 1 秒后生效。

值获取错误。这是 fiddle .

Answer 1

您需要从触发的相同输入 keyup 中获取值，因此您需要在内部使用 $(this) 而不是 $('.onetotal') 延迟功能:

$('.onetotal').keyup(function () {
    delay(function () {
        var xxx = $(this).val();
        var hiddenx = $(this).siblings('.onesubject').val();
        alert(xxx + ' and ' + hiddenx);
    }.bind(this), 1000);
});

演示: http://jsfiddle.net/b2d9859t/1/