Question

我想编写一个代码，可以在键入多个字符后或者经常输入一次后保存元素的内容。

我将调用ajax函数并将内容发送到脚本以保存在后台。只是不确定如何计算。如果我数到30，那就在这里，但如果它是连续打字，即每30个字符怎么样呢？

var count = 0;

$(document).on("keyup", "#target", function(count) {
     if (count > 30) {
         $.ajax({
             ...
         });
     }
     count++; 
});

Answer 1

每次保存时，只需将计数器设置为0.

var count = 0;

$(document).on("keyup", "#target", function(count) {
     if (count > 30) {
         count = 0;
         $.ajax({
            ...
         });
     }
     count++; 
});

Answer 2

模数的经典案例：）

var count = 0;

$(document).on("keyup", "#target", function(count) {
     if (count % 30 === 29) {
         $.ajax({
             ...
         });
     }
     count++; 
});

Answer 3

试试这个：

＆＃13;

$(document).on("keyup", "#target", function() {
     var counter = $('#counter');
     if (parseInt(counter.val()) > 30) {
         counter.val("0");
         console.log("Send Ajax");
     }
     counter.val(function(i, val) { return +val+1 });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" id="target" placeholder="Target">
<input type="text" id="counter" value="0">

＆＃13;

或者：

＆＃13;

var counter = 0;
$(document).on("keyup", "#target", function() {
     if (counter > 30) {
         counter = 0;
         console.log("Send Ajax");
     }
     counter++;
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<input type="text" id="target" placeholder="Target">

＆＃13;

Answer 4

可以使用可以通过计数或时间间隔触发的自定义事件

$(document).on("keyup", "#target", function(count) {
  var $input = $(this),
    count = ($input.data('count') || 0) + 1;
  if (count >= 30) {
    $input.trigger('server_update');
    count = 0;
  }
  $input.data('count', count);
}).on('server_update', '#target', function() {
  var $input = $(this);
  // no need to update server if count is zero
  if ($input.data('count')) {
    $input.data('count', 0);
    // do ajax
    console.log( this.value)
  }
});


setInterval(function() {
  $('#target').trigger('server_update');

}, 1000)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="target" value="test">

使用AJAX定期保存

4 个答案: