Jquery兄弟姐妹在警报中显示未定义 [英] Jquery siblings display undefined in alert

问题描述

Jquery兄弟姐妹显示未定义
我有数量字段和总金额字段，当用户在总金额字段中输入任何内容时，我必须在警报时显示数量。我不关心一段时间的数量，因为我必须明白为什么我的jquery兄弟姐妹不工作。当我输入任何数字时，我在警报中未定义。

Jquery siblings display undefined I have quantity field and the total amount field when user enter anything in the total amount field then I have to display the quantity on alert. I don't care about the quantity for a time because I have to understand that why my jquery siblings is not working. When I enter any number then I am getting undefined in the alert.

这不是我的整个项目，这是我必须了解兄弟姐妹的项目的一部分。我将代码上传到以下链接。

This is not my whole project, This is the part of the project which I have to understand the siblings. I upload the code to the below link.

例如我有数量和总价。如果我使用var qty_number = $（＃number1）。val（）;
然后它将适用于唯一的单个字段。现在我添加了更多按钮如果点击任何用户添加更多，那么它将显示数量+总价+删除按钮。用户最多可以添加10个字段。现在，当用户在总价格中输入任何内容时，我必须显示该行的数量。

for example I have quantity and total price. If i use var qty_number=$("#number1").val(); then it will work for the only single field. Now I have added more button If any user clicked on add more then it will display quantity + total price + remove button. The user can add up to 10 fields. Now when the user enters anything in the total price I have to display the quantity of that row.

如果我的div不在父级中那么我必须使用什么方法它？

if my div is out of the parent then what method i have to use it?

你会帮助我吗？

https://jsfiddle.net/Narendra2015/pu6qy4zr/19/

function increaseValue(n) {
  var value = parseInt(document.getElementById('number' + n).value, 10);
  value = isNaN(value) ? 0 : value;
  value++;
  document.getElementById('number' + n).value = value;
}

function decreaseValue(n) {
  var value = parseInt(document.getElementById('number' + n).value, 10);
  value = isNaN(value) ? 0 : value;
  value < 1 ? value = 1 : '';
  value--;
  document.getElementById('number' + n).value = value;
}
$(".custom").on('keyup', 'input[id^=total_p_price]', function() {

  var that = $(this); // CHANGE HERE
  var total_p_price = that.val();
  var qty_number = that.siblings("input[id^=number]").val();
  alert(qty_number);
  console.log(qty_number);
});

<div class="custom">
  <div class="plus_minus">
    <span class="value_button decrease" onclick="decreaseValue(1)" value="Decrease Value">-</span>
    <input type="number" id="number1" class="qty_number form_control" name="qty_number[]" value="0" class="form_control" />
    <span class="value_button increase" onclick="increaseValue(1)" value="Increase Value">+</span>
  </div>
  <input type="text" class="form_control" name="total_p_price[]" id="total_p_price" />
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

推荐答案

确认我的评论：
使用ID显示数量值：

To confirm my comment: to get the display the quantity value using the id:

function increaseValue(n) {
  var value = parseInt(document.getElementById('number' + n).value, 10);
  value = isNaN(value) ? 0 : value;
  value++;
  document.getElementById('number' + n).value = value;
}

function decreaseValue(n) {
  var value = parseInt(document.getElementById('number' + n).value, 10);
  value = isNaN(value) ? 0 : value;
  value < 1 ? value = 1 : '';
  value--;
  document.getElementById('number' + n).value = value;
}
$(".custom").on('keyup', 'input[id^=total_p_price]', function() {

  var that = $(this); // CHANGE HERE
  var total_p_price = that.val();
  var qty_number=$("#number1").val();
  alert(qty_number);
  console.log(qty_number);
});

<div class="custom">
  <div class="plus_minus">
    <span class="value_button decrease" onclick="decreaseValue(1)" value="Decrease Value">-</span>
    <input type="number" id="number1" class="qty_number form_control" name="qty_number[]" value="0" class="form_control" />
    <span class="value_button increase" onclick="increaseValue(1)" value="Increase Value">+</span>
  </div>
  <input type="text" class="form_control" name="total_p_price[]" id="total_p_price" />
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

这篇关于Jquery兄弟姐妹在警报中显示未定义的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！