我正在尝试计算文本字段的结果。我有两个文本字段,当有人在第一个文本字段上输入诸如 3 或 4
之类的值时,它会在第二个文本字段上生成结果。我也在尝试,如果有人尝试在第二个文本字段上输入值,那么它将在第一个。它适用于第一个条件,但不适用于第二个。我的代码如下。我的第二个文本字段不允许我更改值。
<script type="text/javascript">
jQuery(function(jQuery) {
jQuery('.product-custom-option').on('keyup', function() {
var total = jQuery('.product-custom-option').val();
var perunit = 3;
var newprice = total/perunit;
jQuery('#no_packs').val(Math.ceil(newprice));
});
});
jQuery(function(jQuery) {
jQuery('#no_packs').on('keyup', function() {
var total = jQuery('#no_packs').val();
var perunit = 3;
var newprice = total * perunit;
jQuery('.product-custom-option').val(newprice);
});
});
</script>
HTML:
<dl class="last">
<dt>
</dt><dt><label class="required"><em>*</em>Square meters required</label>
</dt>
<dd class="last">
<div class="input-box">
<input type="text" onchange="opConfig.reloadPrice()" id="options_134_text" class="input-text required-entry product-custom-option" name="options[134]" value="">
</div>
</dd>
</dl>
<div class="">
<label class="required">Number of Packs</label>
<div class="input-box">
<input type="text" id="no_packs" class="input-text product-custom-option" name="qty" value="">
</div>
</div>
最佳答案
发生这种情况是因为您在两个输入字段上定义了相同的类,因此当您在第二个输入字段中输入值时,两个函数都会起作用,因为第二个输入字段具有相同的类。
在第一个字段中添加不同的类,然后在函数中使用相同的类
jQuery(function(jQuery) {
jQuery('.first').on('keyup', function() {
var total = jQuery('.product-custom-option').val();
var perunit = 3;
var newprice = total / perunit;
jQuery('#no_packs').val(Math.ceil(newprice));
});
});
jQuery(function(jQuery) {
jQuery('#no_packs').on('keyup', function() {
var total = jQuery('#no_packs').val();
var perunit = 3;
var newprice = total * perunit;
jQuery('.first').val(newprice);
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<dl class="last">
<dt>
</dt><dt><label class="required"><em>*</em>Square meters required</label>
</dt>
<dd class="last">
<div class="input-box">
<input type="text" onchange="opConfig.reloadPrice()" id="options_134_text" class="input-text required-entry product-custom-option first" name="options[134]" value="">
</div>
</dd>
</dl>
<div class="">
<label class="required">Number of Packs</label>
<div class="input-box">
<input type="text" id="no_packs" class="input-text product-custom-option" name="qty" value="">
</div>
</div>
Well i am ignoring
onchange="opConfig.reloadPrice()"
as may be you are using it in some way but it's showing console errors check about it
关于javascript - 使用js对文本字段进行相互计算,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37788632/