我有一个问题 - 当我完成两个字段(输入1和输入2)并且我尝试更改其中一个时,jQuery返回NaN。请有人帮帮我吗?
我试过使用parseInt,parseFloat但是它仍然不起作用
对不起我的英文:]
JS:
$(document).ready(function(){
$('input[name^="input"]').keypress(function(event) {
if(event.which && (event.which < 48 || event.which > 57)) {
event.preventDefault();
}
});
var $tabs = $('input[name^="tab"]');
$.each($tabs, function(i, a) { $(a).val(''); });
$('input[name^="input"]').keyup(function() {
var count = parseInt($(this).val());
if($(this).attr('name') == 'input1') {
var newValue = count * parseFloat($('input[name="tab1_hidden"]').val());
$('input[name="tab1"]').val(newValue);
}
if($(this).attr('name') == 'input2') {
$.each($tabs, function(i, a) {
if(i > 0) {
var inputHidden = $(a).attr('name') + '_hidden';
var newValue = count * parseFloat($('input[name="' + inputHidden + '"]').val());
$(a).val(newValue);
}
});
}
});
});
HTML:
<form action="" method="post"><div>
<p>input 1: <input type="text" name="input1" value=""></p>
<p> <input type="hidden" name="input1_hidden" value=""></p>
<p>input 2: <input type="text" name="input2" value=""></p>
<p> <input type="hidden" name="input2_hidden" value=""></p>
<p> </p>
<p>tab 1: <input type="text" name="tab1" value=""></p>
<p><input type="hidden" name="tab1_hidden" value="10"></p>
<p>tab 2: <input type="text" name="tab2" value=""></p>
<p> <input type="hidden" name="tab2_hidden" value="20"></p>
<p>tab 3: <input type="text" name="tab3" value=""></p>
<p> <input type="hidden" name="tab3_hidden" value="30"></p>
<p>tab 4: <input type="text" name="tab4" value=""></p>
<p> <input type="hidden" name="tab4_hidden" value="40"></p>
<p>tab 5: <input type="text" name="tab5" value=""></p>
<p> <input type="hidden" name="tab5_hidden" value="50"></p>
<p>tab 6: <input type="text" name="tab6" value=""></p>
<p> <input type="hidden" name="tab6_hidden" value="60"></p>
<p>tab 7: <input type="text" name="tab7" value=""></p>
<p> <input type="hidden" name="tab7_hidden" value="70"></p>
<p>tab 8: <input type="text" name="tab8" value=""></p>
<p> <input type="hidden" name="tab8_hidden" value="80"></p>
</div>
</form>
答案 0 :(得分:0)
$('input[name="tab1_hidden"]').val()
是一个空字符串;如果你parseFloat
,那就是NaN
。使用NaN
进行任何算术运算,它会感染它触及的所有内容。
答案 1 :(得分:0)
<强>更新强>
JS:
count = 0
$("input=[name='input1'], input=[name='input2']").change(function(){
if ($(this).attr("name") == "input1") {
count = $("input=[name='tab1_hidden']").val();
value1 = count * parseInt($(this).val())
$("input[name='tab1']").val(value1);
}
if ($(this).attr("name") == "input2") {
value2 = $(this).val();
countArray = [];
i = 0
$(".hidden").each(function() {
countArray[i] = $(this).val();
i++;
});
$("input=[name='tab2']").val(value2 * countArray[0]);
$("input=[name='tab3']").val(value2 * countArray[1]);
$("input=[name='tab4']").val(value2 * countArray[2]);
$("input=[name='tab5']").val(value2 * countArray[3]);
$("input=[name='tab6']").val(value2 * countArray[4]);
$("input=[name='tab7']").val(value2 * countArray[5]);
$("input=[name='tab8']").val(value2 * countArray[6]);
}
});
});
HTML:
<form action="" method="post"><div>
<p>input 1: <input type="text" name="input1" value=""></p>
<p> <input type="hidden" name="input1_hidden" value=""></p>
<p>input 2: <input type="text" name="input2" value=""></p>
<p> <input type="hidden" name="input2_hidden" value=""></p>
<p> </p>
<p>tab 1: <input type="text" name="tab1" value=""></p>
<p><input type="hidden" name="tab1_hidden" value="10"></p>
<p>tab 2: <input type="text" name="tab2" value=""></p>
<p> <input type="hidden" class="hidden" name="tab2_hidden" value="20"></p>
<p>tab 3: <input type="text" name="tab3" value=""></p>
<p> <input type="hidden" class="hidden" name="tab3_hidden" value="30"></p>
<p>tab 4: <input type="text" name="tab4" value=""></p>
<p> <input type="hidden" class="hidden" name="tab4_hidden" value="40"></p>
<p>tab 5: <input type="text" name="tab5" value=""></p>
<p> <input type="hidden" class="hidden" name="tab5_hidden" value="50"></p>
<p>tab 6: <input type="text" name="tab6" value=""></p>
<p> <input type="hidden" class="hidden" name="tab6_hidden" value="60"></p>
<p>tab 7: <input type="text" name="tab7" value=""></p>
<p> <input type="hidden" class="hidden" name="tab7_hidden" value="70"></p>
<p>tab 8: <input type="text" name="tab8" value=""></p>
<p> <input type="hidden" class="hidden" name="tab8_hidden" value="80"></p>
</div>
</form>