- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
在我的表单中,我让用户输入房间的长度高度和宽度以获得 m2、m3 和瓦特的计算值。但是用户也应该能够直接输入 height 和 m2 来获取值。我尝试了很多语法,但 if else 不能正常工作。我知道我必须以某种方式清空变量,我通过表单重置功能尝试过。
$(document).ready(function() {
// https://allaboutbasic.com/2017/08/25/how-to-add-auto-calculation-fields-or-calculator-in-contact-form-7-using-jquery/;
var le; // länge
var wi; // breite
var he; // höhe
var m2; // quadrat Meter
var m3; // Kubik Meter
var wt1 = 40; // Watt per Kubik
if (!document.getElementById("le").value || !document.getElementById("wi").value) {
$("#le").on("change", function() {
le = parseInt(this.value, 10);
$("#wi").on("change", function() {
wi = parseInt(this.value, 10);
$("#he").on("change", function() {
he = parseInt(this.value, 10);
m2 = le * wi;
m3 = le * wi * he;
wt = m3 * wt1 / 1000;
// runden ohne dezimalstellen "(toFixed(2)) zwei Stellen"
$("#m2").val(m2.toFixed());
$("#m3").val(m3.toFixed());
$("#wt").val(wt.toFixed(3));
});
});
});
} else {
$("#he").on("change", function() {
he = parseInt(this.value, 10);
$("#m2").on("change", function() {
m2 = parseInt(this.value, 10);
m3 = m2 * he;
wt = m3 * wt1 / 1000;
$("#m2").val(m2.toFixed());
$("#m3").val(m3.toFixed());
$("#wt").val(wt.toFixed(3));
});
});
}
});
function resetcalcform() {
document.getElementById("calcForm").reset();
le = undefined; // unset länge
wi = undefined; // unset breite
he = undefined; // unset höhe
m2 = undefined; // unset quadrat Meter
m3 = undefined; // unset Kubik Meter
};
label {
display: block;
}
input {}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<div class="kaecalc ">
<form id="calcForm" name="data_entry" action="#" autocomplete="off">
<div>
<label class="" for="le">Länge in m</label>
<input type="text" class="2" id="le">
<!-- "text" type um "," als dezimal eingabe zu erlauben -->
</div>
<div>
<label class="" for="wi">Breite in m</label>
<input type="text" id="wi">
</div>
<div>
<label class="" for="he">Höhe in m </label>
<input type="text" id="he">
</div>
<div>
<label class="" for="m2">m2 </label>
<input type="number" id="m2">
</div>
<div>
<label class="" for="m3">m3 </label>
<input type="number" id="m3">
</div>
<div>
<label class="" for="watt">KW der Anlage</label>
<input type="number" id="wt">
</div>
</form>
<!-- button MTS Styles -->
<p align="right"><span class="">
<button id="tdmyb1" class="" role="button" onclick="resetcalcform()"><span class="ui-button-icon-primary ui-icon ui-icon-refresh"></span><span class="ui-button-text">reset</span></button>
最佳答案
var le; // länge
var wi; // breite
var he; // höhe
var m2; // quadrat Meter
var m3; // Kubik Meter
var wt1 = 40; // Watt per Kubik
var wt;
var props ={};
$(document).ready(function() {
// https://allaboutbasic.com/2017/08/25/how-to-add-auto-calculation-fields-or-calculator-in-contact-form-7-using-jquery/;
$("#le,#wi,#he,#m2").on("change", function() {
m2=m3=wt=undefined;
props[this.id] = parseInt(this.value, 10);
if(props.le && props.wi && props.he){
m2 = props.le * props.wi;
m3 = props.le * props.wi * props.he;
wt = m3 * wt1 / 1000;
}else if(props.m2 && props.he){
m2 = props.m2;
m3 = props.m2 * props.he;
wt = m3 * wt1 / 1000;
}else if(props.le && props.wi){
m2 = props.le * props.wi;
}
// runden ohne dezimalstellen "(toFixed(2)) zwei Stellen"
$("#m2").val(m2 && m2.toFixed());
$("#m3").val(m3 && m3.toFixed());
$("#wt").val(wt && wt.toFixed(3));
});
});
function resetcalcform() {
document.getElementById("calcForm").reset();
le = undefined; // unset länge
wi = undefined; // unset breite
he = undefined; // unset höhe
m2 = undefined; // unset quadrat Meter
m3 = undefined; // unset Kubik Meter
wt = undefined;
props ={};
};
label {
display: block;
}
input {}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<div class="kaecalc ">
<form id="calcForm" name="data_entry" action="#" autocomplete="off">
<div>
<label class="" for="le">Länge in m</label>
<input type="text" class="2" id="le">
<!-- "text" type um "," als dezimal eingabe zu erlauben -->
</div>
<div>
<label class="" for="wi">Breite in m</label>
<input type="text" id="wi">
</div>
<div>
<label class="" for="he">Höhe in m </label>
<input type="text" id="he">
</div>
<div>
<label class="" for="m2">m2 </label>
<input type="number" id="m2">
</div>
<div>
<label class="" for="m3">m3 </label>
<input type="number" id="m3">
</div>
<div>
<label class="" for="watt">KW der Anlage</label>
<input type="number" id="wt">
</div>
</form>
<!-- button MTS Styles -->
<p align="right"><span class="">
<button id="tdmyb1" class="" role="button" onclick="resetcalcform()"><span class="ui-button-icon-primary ui-icon ui-icon-refresh"></span><span class="ui-button-text">reset</span></button>
关于javascript - 如果是计算形式,则计算立方米=高*平方米或立方米=长*宽*高,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54929742/
我正在寻找一种方法来创建根据价格选择我的产品的过滤器(选择下拉菜单)。 我知道这样的查询是完全可能的: SELECT * FROM products ORDER BY price ASC SELECT
函数参数中或显示尺寸时(高度,宽度)的顺序是否有约定? 最佳答案 我不知道大量的语言,但我使用过的语言(宽度,高度)。它更适合沿着 (x, y) 坐标线。 关于language-agnostic -
在我的表单中,我让用户输入房间的长度高度和宽度以获得 m2、m3 和瓦特的计算值。但是用户也应该能够直接输入 height 和 m2 来获取值。我尝试了很多语法,但 if else 不能正常工作。我知
我在 Elasticsearch 中创建了一个索引,看起来像 {"amazingdocs":{"aliases":{},"mappings":{"properties":{"Adj Close":{"
我有以下功能,我需要清除数据库中的所有图片列并移动到文件系统。当我一次性完成这一切时,内存太多并且会崩溃。我切换到递归函数并执行 20 次写入和批量操作。 我需要为大约 6 个表执行此操作。我的 Re
我正在编写一个函数来计算 PI 的值,并将其作为 double 值返回。到目前为止,一切都很好。但是一旦函数到达小数点后14位,它就不能再保存了。我假设这是因为 double 有限。我应该怎么做才能继
2020年是中国CDN行业从98年诞生到今天快速发展的第二十四年,相关数据显示,全国感知网速持续上扬,达到了3.29兆/秒,标志着在宽带中国的政策指导下,中国的网速水平正在大步赶上世界发达国家的水平
在 aerospike 集合中,我们有四个 bin userId、adId、timestamp、eventype,主键是 userId:timestamp。在 userId 上创建二级索引以获取特定用
$('#container').highcharts('Map', { title : { text : 'Highmaps basic demo'
有没有办法显示自定义宽度/高度的YouTube视频? 最佳答案 在YouTube网站上的this link中: You can resize the player by editing the obj
我使用 Highcharts ,我想在 Highcharts 状态下悬停时制作动态不同的颜色。 正如你可以看到不同的颜色,这就是我做的 var usMapChart , data = [] ; va
在所有节点上运行 tpstats 后。我看到很多节点都有大量的 ALL TIME BLOCKED NTR。我们有一个 4 节点集群,NTR ALL TIME BLOCKED 的值为: 节点 1:239
我发现 APC 上存在大量碎片 (>80%),但实际上性能似乎相当不错。我有 read another post这建议在 wordpress/w3tc 中禁用对象缓存,但我想知道减少碎片是否比首先缓存
对于我的脚本类(class),我们必须制作更高/更低的游戏。到目前为止,这是我的代码: import random seedVal = int(input("What seed should be u
我发现 APC 上存在大量碎片 (>80%),但实际上性能似乎相当不错。我有 read another post这建议在 wordpress/w3tc 中禁用对象缓存,但我想知道减少碎片是否比首先缓存
对于我的脚本类(class),我们必须制作更高/更低的游戏。到目前为止,这是我的代码: import random seedVal = int(input("What seed should be u
我已经 seen >2 字节的 unicode 代码点,如 U+10000 可以成对编写,如 \uD800\uDC00。它们似乎以半字节 d 开头,但我只注意到了这一点。 这个 split Actio
有人可以帮我理解为什么我的饼图百分比计算不正确吗?看截图: 根据我的计算,如 RHS 上所示,支出百分比应为 24.73%。传递给 Highcharts 的值如下:- 花费:204827099.36-
我阅读了有关该问题的所有答案,但我还没有找到任何解决方案。 我有一个应用程序,由我的 api 服务器提供。 Wildfly 8.1 和 Mysql 5.6。当查看时间到来时(Wildfly 服务器连接
我正在用选定的项目创建圆形导航。当用户单击任何项目时,它将移动到定义的特定点。一切都很好,除了当你继续点击项目时,当动画表现不同并且项目在 360 度圆中移动并且它被重置直到你重复场景时,我希望它
我是一名优秀的程序员,十分优秀!