如何使用javascript在另一个文本框的输入值中更改两个文本框的显示值?

时间:2022-11-29 20:14:10

Hello i have just started to learn javascript and want to change the value i two text boxes through user input in another. The problem is that nothing happens to the two input fields attr-cost and attr-dice then the user inputs a number in attr-score. Here are the input fields in HTML:

你好,我刚刚开始学习javascript,想通过用户输入来改变我的两个文本框的值。问题是,在两个输入字段中,没有什么会发生吸引成本和吸引人的问题,然后用户输入一个数字的attr-score。以下是HTML中的输入字段:

<td><input type="number" class="my-input attr-score" placeholder=" +" /</td>
<td><input type="number" class="my-input attr-cost" disabled></td>
<td><input type="text" class="my-input attr-dice" disabled></td>

And here is the javascript/Jquery code:

下面是javascript/Jquery代码:

$(".attr-table.attr-score").on("keyup", scoreCostDice);

function scoreCostDice(){
    var score = $(this).val();
    var cost = calcCost(score);
    var dice = calcDice(score);
    $(this).parent().next().children(.attr-cost).val(cost);
    $(this).parent().next().children(.attr-dice).val(dice);
}
function calcCost(score){
    if (score == 0) {
        return = 0;
    }else (if score == 1) {
        return = 1;
    }else (if score == 2){
        return = 3;
    }else (if score == 3) {
        return = 6;
    }else (if score == 4) {
        return = 10;
    }else (if score == 5) {
        return = 15;
    }
}
function calcDice(score){
    if (score == 0) {
        return = "1d4";
    }else (if score == 1) {
        return = "1d4";
    }else (if score == 2){
        return = "1d6";
    }else (if score == 3) {
        return = "1d8";
    }else (if score == 4) {
        return = "1d10";
    }else (if score == 5) {
        return = "2d6";
    }
}

The problem is that the value of attr-score input field should change what is displayed in the fields attr-cost and attr-dice. So if the user inputs the number 1 in attr-score then attr-cost should show 1 and attr-dice should show 1d4. The problem is that the attr-cost and attr-dice don't respond to the input in attr-score. Attr-cost and attr-dice still remain empty. If there i a need for more html code i will provide it.

问题在于,attr-score输入字段的值应该会改变在字段中显示的具有吸引力的价格和吸引力。因此,如果用户输入的数字1在attr-score中,那么attr-cost应该显示1,而attr-dice应该显示1d4。问题在于,吸引人的成本和吸引人的因素不会对吸引人的输入作出回应。诱人的价格和诱人的价格仍然是空的。如果我需要更多的html代码,我将提供它。

1 个解决方案

#1


0  

$(".attr-score").on("keyup", scoreCostDice);
function scoreCostDice() {
        var score = $(this).val();
        var cost = calcCost(score);
        var dice = calcDice(score);
        $(this).parent().siblings().find('.attr-cost').val(cost);
        $(this).parent().siblings().find('.attr-dice').val(dice);
}

function calcCost(score) {
   if (score == 0) {
       return 0;
   } else if (score == 1) {
       return 1;
    } else if (score == 2) {
       return 3;
    } else if (score == 3) {
       return 6;
    } else if (score == 4) {
       return 10;
    } else if (score == 5) {
       return 15;
    }
}

function calcDice(score) {
    if (score == 0) {
       return "1d4";
     } else if (score == 1) {
        return "1d4";
     } else if (score == 2) {
        return "1d6";
      } else if (score == 3) {
        return "1d8";
      } else if (score == 4) {
         return "1d10";
      } else if (score == 5) {
         return "2d6";
      }
}

#1


0  

$(".attr-score").on("keyup", scoreCostDice);
function scoreCostDice() {
        var score = $(this).val();
        var cost = calcCost(score);
        var dice = calcDice(score);
        $(this).parent().siblings().find('.attr-cost').val(cost);
        $(this).parent().siblings().find('.attr-dice').val(dice);
}

function calcCost(score) {
   if (score == 0) {
       return 0;
   } else if (score == 1) {
       return 1;
    } else if (score == 2) {
       return 3;
    } else if (score == 3) {
       return 6;
    } else if (score == 4) {
       return 10;
    } else if (score == 5) {
       return 15;
    }
}

function calcDice(score) {
    if (score == 0) {
       return "1d4";
     } else if (score == 1) {
        return "1d4";
     } else if (score == 2) {
        return "1d6";
      } else if (score == 3) {
        return "1d8";
      } else if (score == 4) {
         return "1d10";
      } else if (score == 5) {
         return "2d6";
      }
}