Question

我在这里有一个情况。我是按时间顺序写这种情况的。

假设有input[type=number]和按钮。
单击该按钮时，它会将属性值(data-oldval="")更改为输入数字的当前值。
下次单击该按钮时，它应该使用data-oldval属性中的数字添加输入中的当前值。
但问题是，我无法读取新更新的属性值。

为了使情况更清楚，我在下面添加了代码段。我希望这里的任何人都可以帮助我。

var response = $('.response');

$('body').on('click', '.btn', function() {
  var btn = $(this),
    t = btn.parent('.dummy'),
    n = t.find('input[type=number]'),
    val = n.val(),
    oldval = n.data('oldval');

  n.attr('data-oldval', val+oldval);

  response.text(n.data('oldval'));
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="dummy">
  <input type="number" value="1" data-oldval="0">
  <button class="btn" type="submit">Add</button>
</div>

<div class="response"></div>

Answer 1

两个问题;您需要使用data('oldval')检索值，而不是attr()，还需要将val()转换为整数，以便将其添加到旧值中。试试这个：

＆＃13;

var response = $('.response');

$('body').on('click', '.btn', function() {
  var btn = $(this),
    t = btn.parent('.dummy'),
    n = t.find('input[type=number]'),
    val = parseInt(n.val(), 10),
    oldval = n.data('oldval');

  n.data('oldval', val + oldval);

  response.text(n.data('oldval'));
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="dummy">
  <input type="number" value="1" data-oldval="0">
  <button class="btn" type="submit">Add</button>
</div>

<div class="response"></div>

＆＃13;

Answer 2

您需要解析输入到输入中的数字，否则它将作为字符串返回并在设置val + oldval

时连接

console.log(typeof(val)) // string

val = parseInt(n.val());

您也可以使用jQuery数据方法设置属性，就像您检索它以更新响应元素一样。

n.data('oldval', val + oldval);

请参阅https://jsfiddle.net/aso1s0xz/

Answer 3

已有一个很好的答案，但这里是没有data-oldval的解决方案，因为我不明白为什么在这种情况下需要它。

$('body').on('click', '.btn', function() {
  var response = parseInt($('.response').text());
  if(isNaN(response))response=0;
  var val = parseInt($('input').val());
  var sum = val+response;
  $('.response').text(sum);
})

Answer 4

要获得动态价值，请尝试JS，它将完美运行

// Teacher struct:
type Teacher struct {
    body   string `json:"body"`
    id     int    `json:"id"`
    title  string `json:"title"`
    userID int    `json:"userID"`
}

Answer 5

使用jQuery中的Data()方法设置值：

＆＃13;

var response = $('.response');

$('body').on('click', '.btn', function() {
  var btn = $(this),
    t = btn.parent('.dummy'),
    n = t.find('input[type=number]'),
    val = n.val(),
    oldval = n.data('oldval');

  n.data('oldval', parseInt(val)+parseInt(oldval));

  response.text(n.data('oldval'));
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="dummy">
  <input type="number" value="1" data-oldval="0">
  <button class="btn" type="submit">Add</button>
</div>

<div class="response"></div>

＆＃13;

读取动态更新的属性值jquery

5 个答案: