Jquery 同级在警报中显示未定义

2024-03-13

Jquery兄弟显示未定义 我有数量字段和总金额字段,当用户在总金额字段中输入任何内容时,我必须显示警报数量。我暂时不关心数量,因为我必须理解为什么我的 jquery 兄弟姐妹不工作。当我输入任何数字时,我的警报中就会出现未定义的情况。

这不是我的整个项目,这是项目中我必须理解兄弟姐妹的部分。我将代码上传到下面的链接。

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

如果我的 div 超出了父级那么我必须使用什么方法?

你能帮我解决这个问题吗?

https://jsfiddle.net/Narendra2015/pu6qy4zr/19/ 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>

输入的数量与总输入不在同一 div 中(它们没有相同的父级(容器),因此它们不是兄弟姐妹,如果将两个输入放在同一 div 中,数量将显示在警报中。 这里是代码:

<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>

<input type="text" class="form_control" name="total_p_price[]" id="total_p_price" />
 </div>
</div>

这里有一个链接来了解jquery兄弟:https://api.jquery.com/siblings/ https://api.jquery.com/siblings/

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Jquery 同级在警报中显示未定义 的相关文章

  • 如何为多个元素添加Class?

    我正在使用这段 javascript 向多个元素添加一个类 我试图引用多个 div 并向它们添加类 它只适用于第一个 JavaScript
  • React-Router v5 History.push 不触发组件

    很抱歉朋友们又问这个问题了 我找到了解决这个问题的几个方法 但他们让我很困惑 我只是想问一个优雅的方法来做到这一点 正如你通过标题所理解的 我有一个关于反应路由的问题 让我解释 我有一个按钮 其名称是Login 单击按钮后 我执行了一些逻辑
  • 在 IE 中使用
    标签时,填充不起作用

    我在我的应用程序中使用 HTML5 标签 标签的填充在 chrome ff 和 safari 中工作正常 但在 IE 中不起作用 我尝试添加显示 块 与部分样式 但它没有用 有什么解决办法吗 许多旧浏览器不理解 HTML5 标签 例如sec
  • 节省页面加载时间的提示[重复]

    这个问题在这里已经有答案了 我的问题 削减那些不必要的 kb 并使页面加载速度更快的最佳方法是什么 全部是什么优化实践 编码实践 在js php中 如果执行可以使您的页面更轻 为什么我问这个 我读了这篇关于 jquery js 与 jque
  • ES6 Promises/在满足多个 Promise 后调用函数(不能使用 Promises.all)[重复]

    这个问题在这里已经有答案了 我正在编写 Javascript 它需要这些事件按以下顺序发生 同时触发多个 API 调用 所有调用完成且响应返回后 执行一行代码 听起来很简单 但棘手的部分是我不能使用 Promises all 因为我仍然希望
  • 如何获取 Html.Editorfor 的日期选择器

    在我的 MVC3 剃刀页面上 我有一个日期字段 Html EditorFor model gt model Member Dob 下面给出的是我试图获取出生日期字段的日期选择器的代码 Scripts jquery validate min
  • javascript 多维类型数组 (Int8Array) 示例

    我尝试使用类型数组而不是数组来减少内存 function createarrayInt8 numrows numcols number var arr new Int8Array numrows for var i 0 i lt numro
  • 如何在 html 画布上使文本适合精确的宽度?

    如何在 html5 画布上将单行文本字符串调整为精确的宽度 到目前为止我尝试过的是以初始字体大小编写文本 测量文本的宽度measureText my text width 然后根据我想要的文本宽度和实际文本宽度之间的比例计算新的字体大小 它
  • charset-utf8 和字符实体

    我建议将我的 windows 1252 XHTML 网页转换为 UTF 8 我的编码中有以下字符实体 39 撇号 9658 右指针 9668 左指针 如果我使用编辑器更改字符集并将页面保存为 UTF 8 撇号保留为字符实体 指针被转换为代码
  • 画廊自动播放幻灯片?

    有没有人找到一种简单的方法来让很棒的画廊自动播放 我真的被这个困住了 任何帮助都会很棒 Thx Paul 自动播放 真 在选项中应该可以解决问题 autoplay type Boolean or Number default false 如
  • 为什么react中的组件需要大写? [复制]

    这个问题在这里已经有答案了 因此 当您声明一个组件以小写首字母进行反应时 它不会显示 也不会引发错误 当您将组件名称大写时 它确实有效 这样的实现是怎样的呢 为了避免与现有的 html 元素发生冲突 还是这是一个错误 var test Re
  • js中将div旋转到一定高度

    How to rotate a div to certain height suppose 10px I can rotate a div otherwise around 360 degrees I need the angle by w
  • jQuery.ajax() 记录 HTTP 请求

    我有一个发送 HTTP POST 请求的函数 我想记录它以进行调试 这是函数 function serverRequest URL DATA callback ajax url URL type POST dataType text con
  • 保留以下文本的标题

    我正在使用 css 列计数功能将我的部分分成两列 在一个页面上 我在第一列的底部有一个 h3 标题 在下一列的顶部有一个 p 段落 我想保留该段落的前几句话的标题 我可以将其与整个段落一起包装在使用 inline block 样式的 div
  • javascript捕获文本区域中的粘贴事件

    我目前有一个文本区域 我需要控制已粘贴的文本 本质上 我需要能够将用户想要粘贴到文本区域中的任何内容并将其放入变量中 然后我将计算出他们粘贴文本的位置和字符串的大小 以将其从文本区域中删除 然后最后用我自己的方式处理变量中的文本 我的问题
  • 使用 CSS 屏蔽图像

    我做了这样的设计 如何用CSS遮盖背景 我试过这样的代码 img poster display block max width 100 webkit mask image url https cdn pbrd co images GYiCo
  • 在 Javascript 中使用 fetch API 接收和处理 JSON

    在我的项目中 当条件不足时 我的 Django 应用程序会发送带有消息的 JSON 响应 我使用这个 JsonResponse 指令 Code data is taken email email return JsonResponse da
  • 以特定顺序运行具有效果的 jQuery 函数

    我在 javascript 函数中有一些 jQuery 可以更改页面上的文本并以特定的时间间隔淡入和淡出 我希望这些函数在每个函数完成其效果后按顺序运行 dialogueExchange1 dialogueExchange2 dialogu
  • 使 html svg 对象也成为可点击的链接(在 iPhone 上)

    这个问题与使 html svg 对象也成为可点击的链接 https stackoverflow com q 11374059 4825796 但给出的答案似乎不适用于 iPhone ios 9 3 safari 和 chrome 浏览器 我
  • 带有 'as' 属性的通用 React TypeScript 组件(能够渲染任何有效的 dom 节点)

    我在下面的示例中按预期工作 我的问题是 无论如何我可以重写它 这样我就不必传递通用的T和as支柱 理想情况下我想通过asprop 并让组件的 prop 接口使用它 这在 TypeScript 中可能吗 export type Props l

随机推荐