我需要带有输入数字和复选框值（文本）的输出结果。
我做了一些代码。
它与准备好的数据进行比较，并显示结果，但只有使用数量范围过大。
因此我更改了复选框值'a，b，c'而不是'1,2,3'，但是它不起作用。
我怎样才能解决这个问题？
<script src="https://code.jquery.com/jquery-1.7.1.js"></script>
<script type="text/javascript">
window.onload=function(){
$('.height,.style').on('change, input',
function(){
$('.total').val($('.height').val() * $('.style:checked').val());
});
$('.height,.style').on('change, input',
function(){
var total2 = $( 'input#total' ).val();
if ( total2 == 168a ) {
document.getElementById("total2").innerHTML = 'S';
} else if ( total2 == 170a) {
document.getElementById("total2").innerHTML = 'M';
} else if ( total2 == 182a) {
document.getElementById("total2").innerHTML = 'XL';
} else if ( total2 == 165b) {
document.getElementById("total2").innerHTML = 'S';
} else if ( total2 == 175b) {
document.getElementById("total2").innerHTML = 'M';
} else if ( total2 == 180b) {
document.getElementById("total2").innerHTML = 'L';
} else if ( total2 == 175c) {
document.getElementById("total2").innerHTML = 'L';
} else if ( total2 == 176c) {
document.getElementById("total2").innerHTML = 'XL';
} else {
document.getElementById("total2").innerHTML = 'XL';
}
});
function onlyNumber(){
if((event.keyCode<48)||(event.keyCode>57))
event.returnValue=false;
}
}
</script>
<table>
<tbody>
<tr id="person_total">
<td><input name="height" type="number" class="span1 height" min="150" max="200" maxlength="3"></td>
<td>
<input type="radio" name="stylebox" class="style" value="a">
<label for="kjc-small">S</label>
<input type="radio" name="stylebox" class="style" value="b" checked="">
<label for="kjc-normal">N</label>
<input type="radio" name="stylebox" class="style" value="c">
<label for="kjc-big">B</label>
</td>
<td><input name="total" type="hidden" id="total" class="span1 total"></td>
</tr>
</tbody>
</table>
<div id="total2"></div>
最佳答案
据我所知，*不是用于字符串连接。 +用于连接...所以某个数字+'（null）'+一些字母将返回一个字符串。在您的if语句中，您需要将它们读取为字符串...因此为“ 170a”，而不是170a。计算机无法识别170a是什么...是整数，浮点数等吗？相对于“ 170a”显然是一个字符串，计算机可以检查字符串是否彼此相等，即var x = 'hi'; if (x == 'hi') { alert('yes!'); }。您不必创建另一个事件侦听器，侦听相同的事件，而只需调用另一个函数，甚至不必在侦听器的函数内包含代码即可运行代码。
因此，这将执行您几乎用javascript / jQuery / psuedocode描述的内容...但是...如果您希望它执行我认为打算执行的操作，请给我15分钟的时间。编辑：从头开始。我没有足够的数据来确定需要去哪里。这个概念在那里存在，并且在返回信息方面起作用。
<html>
<head>
<script src="https://code.jquery.com/jquery-1.7.1.js"></script>
<script type="text/javascript">
window.onload=function()
{
$('.height,.style').on('change, input',
function(){
var my_var = $(".height").val() + '' + $("input[name='stylebox']:checked").val();
//alert(my_var);
document.getElementById('total').value = my_var;
update_func(my_var);
});
//No need to have that twice...
/*$('.height,.style').on('change, input', */
function update_func(x){
//this is x
total2 = x;
/*var total2 = $( 'input#total' ).val();*/
if ( total2 == '168a') {
document.getElementById("total2").innerHTML = 'S';
} else if ( total2 == '170a') {
document.getElementById("total2").innerHTML = 'M';
} else if ( total2 == '182a') {
document.getElementById("total2").innerHTML = 'XL';
} else if ( total2 == '165b') {
document.getElementById("total2").innerHTML = 'S';
} else if ( total2 == '175b') {
document.getElementById("total2").innerHTML = 'M';
} else if ( total2 == '180b') {
document.getElementById("total2").innerHTML = 'L';
} else if ( total2 == '175c') {
document.getElementById("total2").innerHTML = 'L';
} else if ( total2 == '176c') {
document.getElementById("total2").innerHTML = 'XL';
} else {
document.getElementById("total2").innerHTML = 'XL';
}
}
function onlyNumber()
{
if((event.keyCode<48)||(event.keyCode>57))
{
event.returnValue=false;
}
}
}
</script>
</head>
<body>
<table>
<tbody>
<tr id="person_total">
<td><input id="height" name="height" type="number" class="span1 height" min="150" max="200" maxlength="3"></td>
<td>
<input type="radio" name="stylebox" class="style" value="a">
<label for="kjc-small">S</label>
<input type="radio" name="stylebox" class="style" value="b" checked="">
<label for="kjc-normal">N</label>
<input type="radio" name="stylebox" class="style" value="c">
<label for="kjc-big">B</label>
</td>
<td><input name="total" type="hidden" id="total" class="span1 total"></td>
</tr>
</tbody>
</table>
<div id="total2"></div>
</body>
</html>
`