jquery:两个数字的百分比

2023-11-24

EDITED

感谢所有提供支持的人...我将与您分享最好的工作脚本,希望可以帮助正在寻找相同解决方案的其他人:

    $(document).ready(function(){
$("#price1, #price2").keyup(function() {
  var priceOne = parseFloat($("#price1").val());
  var priceTwo = parseFloat($("#price2").val());
  var rate = parseFloat($("#rate").val());
  if ($("#price1").val() && $("#price2").val()){     
  $('#rate').val(((priceTwo - priceOne) / priceOne * 100).toFixed(2));
}

});

$("#rate").keyup(function() {
  var priceOne = parseFloat($("#price1").val());
  var rate = parseFloat($("#rate").val());

   if ($("#rate").val() && $("#price1").val() && $("#price2").val()){
 $('#price2').val(((priceOne * rate)/ 100 + priceOne).toFixed(2));
}
});
})

您也可以按照此进行测试LINK


最初的问题:

请帮忙计算两个数字之间的百分比。我尝试了一种方法,但没有成功。请告诉我出了什么问题,或者如果您可以推荐其他可以帮助我的脚本,我将不胜感激

我的脚本:

<html>
<head>
 <script type="text/javascript">
$("#rate").text(function() {
    var result = (parseInt(($("#price1").text(), 10) * 100)/ parseInt($("#price2").text(), 10));
    if (!isFinite(result)) result = 0;
    return result;
});?
</script> 

</head>
<body>
<div id="price1"><label><input id="price1" type="text"></label></div>
<div id="price2"><label><input id="price2" type="text"></label></div>
<div id="rate"><label><input id="rate" type="text"></label></div>


</body>
</html>

use val()代替text()对于输入元素,使用$(function(){})等待 DOM 准备就绪。并且不要对元素使用相同的 ID。

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
  $("#price1, #price2").change(function() { // input on change
    var result = parseFloat(parseInt($("#price1").val(), 10) * 100)/ parseInt($("#price2").val(), 10);
    $('#rate').val(result||''); //shows value in "#rate"
  })
});
</script> 
</head>
<body>
<div id="price-div1"><label>price1</label><input id="price1" type="text"></div>
<div id="price-div2"><label>price2</label><input id="price2" type="text"></div>
<div id="rate-div"><label>rate</label><input id="rate" type="text">%</div>
</body>
</html>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

jquery:两个数字的百分比 的相关文章

  • CSS隐藏滚动条,但元素可滚动

    我有一个名为 items 的元素 元素内的内容更长 比元素高度 我想让它可滚动但隐藏滚动条 我该怎么做呢 div class left side div class items style display block width 94 ma
  • 如何使用 Next Script 精确控制脚本标签的插入位置

    我目前正在尝试将第三方脚本添加到我的 Next js 应用程序中 该脚本会在脚本标签正下方插入一个 iframe 所以我需要精确控制脚本标签在页面上的位置 我目前正在使用下一个 脚本 https nextjs org docs api re
  • 音频标签的 Html5 惰性“onplay”事件处理程序?

    使用新的 Html5 音频标签 onplay 事件似乎仅在第一次播放音频时触发 在此示例中 当单击 播放 时 音频将开始并显示一个显示 正在播放 的警报弹出窗口 当音频结束并再次单击 播放 时 音频会再次开始 但不会触发警报 我在这里错过了
  • 表单输入不会采用百分比填充

    如果使用像素填充 我的表单输入会正确显示 但使用左侧和右侧的百分比填充会破坏它 我不明白为什么 它可以在 Safari 中运行 但在 Firefox 3 5 3 OSX 中损坏 问题是 当我使用百分比填充时 填充全部中断 因此输入值没有很好
  • 使用ajax发送表单数据

    我想用 ajax 以表单形式发送所有输入 我有一个这样的表单
  • 添加选中的单选按钮的总数

    UPDATE 如果您尝试此链接上的表格http jsfiddle net Matt KP BwmzQ http jsfiddle net Matt KP BwmzQ 按下小提琴并选择右上角的 40 英镑单选按钮 然后在底部看到订单总额 上面
  • 某些表格后的分页符

    我的问题是 我有一个页面 其中包含几个要打印的 html 表格 有些表有很多行 有些则没有 我想要做的是将第一个和第二个表 大表 打印在单独的页面中 其余表 小表 每页打印两个 如何在我想要的位置放置分页符 我试过 但这会在每个表格后面添加
  • 如何获得浮动:右键垂直居中对齐

    我只是无法获得课程按钮align right垂直居中对齐 HTML div class panel footer span style width 100 class header footer item span div
  • 按 Enter 键提交消息?

    我正在开发一个基于本教程使用 Meteor 构建的聊天应用程序 http code tutsplus com tutorials real time messaging for meteor with meteor streams net
  • 根据屏幕尺寸更改图像 src

    我正在尝试使用媒体查询根据屏幕尺寸更改图像 src 我尝试过背景 url x 但它不起作用 我在某处读到我应该使用 content url x 代替 但是当我这样做时 我得到一个空白页面 谁能告诉我我的代码有什么问题吗 HTML div c
  • 如何从左向右滑动文本和图像并具有滑动效果[关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • 为什么人们将自己的自定义/用户函数添加到 jQuery 对象中? [关闭]

    Closed 这个问题是基于意见的 help closed questions 目前不接受答案 我见过人们将自己的自定义 用户功能添加到jQuery目的 例如 myUserFunc function regular JS code 你为什么
  • 为什么只读输入字段无效

    考虑以下 html
  • Jquery:排除元素

    我有以下代码 document ready function a rel each function this qtip content text img class middle src i icon processing gif alt
  • getJson问题,它返回未定义

    大家好 我有这个代码 var temp if method 1 temp Words val get the words from textbox else getJSON http localhost mine test js funct
  • 如何使用css网格制作一个垄断板?

    I want to create a monopoly board like There are following features in the board 角是方形的 比其他盒子大 每行的文本都面向特定的角度 我的基本 html 结构
  • 为什么 Firefox 3.6 改变了 jQuery 和 CSS 属性?

    为什么 Firefox 3 6 改变了 jQuery 和 CSS 属性 好吧 更具体一点 我有一个交叉淡入淡出插件 可以在放置在彼此之上的两个图像之间创建发光效果 该函数 如下所示 将使顶部图像在悬停时在 200 毫秒内转换为不透明度 0
  • Xpath 获取 if href 包含字符串的一部分

    您好 我尝试获取包含 href p random tagged see 的所有元素 这是我的路线 div preceding h2 text Most recent div div a href p tagged see 我该如何修复此代码
  • 使用外部按钮选择下一个/上一个单选按钮

    我正在制作一种幻灯片形式 当用户单击下一张图像时 还必须选择单选按钮 我的滑动功能可以正常工作 下一个按钮 也可以工作 但我有点坚持使用 上一个 按钮 不明白为什么它不起作用 fiddle http jsfiddle net V4tdx 这
  • 如何在控制台中隐藏日志消息的来源?

    当将消息输出到控制台时 还会显示源代码 在 Chrome 开发者工具中 它位于右侧 console log Foo Source Foo test js 1 Output 但是 在某些网站上 会显示消息without正在显示的源 例如Fac

随机推荐

  • 如何将字典中的值添加到电子表格?

    我有一个模板电子表格文档 其中有两列 服务器名称和 IP 地址 如何填充电子表格 以便每个字典键位于 服务器 列中自己的单元格中 而相应的值位于 IP 列中它旁边的单元格中 我正在使用 EPPlus 库 但找不到有关该主题的任何内容 以下是
  • Django:如何使用子查询注释 M2M 或 OneToMany 字段?

    I have Order物体和OrderOperation代表订单操作 创建 修改 取消 的对象 从概念上讲 一个订单有一对多的订单操作 每次对订单进行操作时 都会在该操作中计算总计 这意味着当我需要查找订单的属性时 我只需使用子查询获取最
  • 如何查明“调试模式”是否已启用

    Java 程序如何知道它是否在调试模式下运行 应用程序在常规 全速 模式下的行为应与 调试模式 下 当连接调试器时 在调试模式下运行时 略有不同 应用程序通过 TCP 与另一台计算机 另一个进程或自身内部进行通信 我的同事希望我们使用Soc
  • 如何使用 Composer 安装 Zend Framework 2 Tool

    我不知道如何在使用 Composer 引导时运行 zf php Zend Framework 2 Tool 首先 我根据文档引导 Composer 和 zftool mkdir tmp cd tmp curl s https getcomp
  • docker-compose 在启动使用 create-react-app 创建的 React 应用程序后立即停止

    我正在尝试使用以下命令创建一个反应应用程序create react app所描述的工具here 我想用docker compose在 docker 容器内运行 React 应用程序 我已采取以下步骤 在我的机器上我创建了一个目录调用app并
  • 全局引用命名空间?

    有没有办法在整个解决方案中全局引用命名空间 因此 不要在每个代码文件中都包含这些行 using System using MyNamespace 只需声明一次 每个代码文件都会使用它们 顺便说一句 我正在使用 Visual Studio 不
  • 如何编译 Hive UDF

    我正在尝试编译这个 UDF package com dataminelab hive udf import org apache hadoop hive ql exec UDF import org apache hadoop io Tex
  • 在Python中接收16位整数

    我正在通过串行端口从硬件读取 16 位整数 使用Python 我怎样才能得到正确的LSB和MSB 并使Python明白它是我正在摆弄的16位有符号整数 而不仅仅是两个字节的数据 尝试使用struct module import struct
  • 如何将角度材料步进器步数更改为任何图标或文本?

    角度材料步进器对我来说有以下问题 我无法从文档中找到这些问题 如何显示任何字符串或 html 而不是步进索引 数字 怎么才能显示mat工具提示当鼠标悬停在任何垫子步骤上时 我正在使用最新版本材质 角 IO 不幸的是 现在不可能使用材料中的本
  • 云上的 Node.js TCP 套接字服务器 [Heroku/AppFog]

    可以在 Node js 上运行面向 TCP 套接字的应用程序Cloud 更具体地说Heroku or AppFog 它不会是一个 Web 应用程序 而是一个用于客户端程序访问的服务器 基本思想是利用Cloud 扩展和易于使用的平台 我知道这
  • jQuery 中文档就绪的不同方式?

    这些是同一件事吗 即表示文档准备就绪的方式 function and function jQuery 或者两者之间是否有区别 如果有那么我什么时候应该使用哪个 第一个是快捷方式 ready 第二个是无效的 因为您试图调用一个不可调用的对象
  • 使用 JavaScript 清除 HTML 页面

    有没有办法使用 JavaScript 函数删除页面上现有内容的部分内容 像这样 i i
  • Chrome 和 Firefox 中的 Javascript 提升

    在 Chrome 和 Firefox 中运行它会给出不同的答案 function if true function f alert yes else function f alert no f 在 Chrome 中 结果是 否 在 Fire
  • 形成和排序正整数数组的最快策略

    在 Java 中 什么更快 创建 填充然后排序一个整数数组 如下所示 int a int 1000 for int i 0 i lt a length i not sure about the syntax a i Maths rand 1
  • 如何使用 CAKeyframeAnimation 对 CoreGraphics 形状绘制进行动画处理

    我正在尝试在 UIView 子类中对 UIBezierPath 在我的示例中是三角形 的绘制进行动画处理 然而 整个子视图是动画的 而不是形状 我在动画中缺少什么吗 void drawRect CGRect rect CAShapeLaye
  • ASP.NET MVC 3:将应用程序移至虚拟目录中。我必须改变什么?

    我一直在开发 MVC 3 应用程序 我使用的是 VS 2010 的内置 Web 服务器 今天 由于各种原因 我被要求将其移动到虚拟目录中并在 IIS 7 下运行 仍然在我的开发 PC 上 现在它的 URL 是localhost MyVirt
  • 使用 MediaCodec 和 MTK Codec 编码时选择 H264 Profile

    我们有一个 Android 应用程序 可以将视频编码为 H264 在所有以前尝试过的 Android 设备上 这都会编码为 Baseline 配置文件 这正是我所需要的 在 Lenovo Yoga 10 上 编解码器为 OMX MTK VI
  • 使用 web3 以太坊调用智能合约方法

    尝试使用以太坊解决区块链问题时 我在尝试与已部署的合约交互时遇到了问题 我想要实现的是调用一个方法来显示添加到使用 Geth 本地部署的私有区块链中的信息 我无法从我的智能合约中调用任何函数 我一直想知道我是否做错了什么 有人可以告诉我如何
  • 如何使用 Perl 对 PDF 文件进行全文搜索?

    我有一堆 PDF 文件 我的 Perl 程序需要对它们进行全文搜索以返回哪些文件包含特定字符串 迄今为止我一直在使用这个 my search results grep i l string pdf 其中 string 是要查找的文本 然而
  • jquery:两个数字的百分比

    EDITED 感谢所有提供支持的人 我将与您分享最好的工作脚本 希望可以帮助正在寻找相同解决方案的其他人 document ready function price1 price2 keyup function var priceOne p