在JavaScript中為乘法時間表添加起點和終點

Question

例如-顯示從5（4 * 5）開始到9結束的4次表。

- 4*5 = 20
- 4*6 = 24
- 4*7 = 28
- 4*8 = 32
- 4*9 = 36

我很困惑如何添加開始和結束值。

 function printTable(){ var timesTable =Number(document.getElementById('txtNumber').value); for(var i=1; i<=10; i++){ var pTag= document.getElementById('pPrint'); pTag.innerHTML += (timesTable*i) + "<br/>" } } 

 <body style="text-align: center;"> <h1>JavaScript - Function to Display Table of an entered Number.</h1> <p><input type="text" id="txtNumber" placeholder="Enter number"/></p> <h1>enter the start value</h1> <p><input type="text" id="textNumber" placeholder="Enter number"/></p> <h1>enter the end value</h1> <p><input type="text" id="teextNumber" placeholder="Enter number"/></p> <p><input type="button" value="Print Table." onclick='printTable()'/> <!--print numbers--> <p id="pPrint"></p> </body> 

如何在JavaScript中為乘法時間表添加起點和終點？

Answer 1

如果我正確理解了您的問題，也許您可​​以執行以下操作；

1. 通過Number(document.getElementById('textNumber').value)獲取起始編號
2. 通過Number(document.getElementById('teextNumber').value)獲取結束號
3. 使用for循環可通過for(var i= start; i<= end; i++){

您還應該檢查起始編號是否小於結束編號，以確保循環終止：

 function printTable(){ var start = Number(document.getElementById('textNumber').value); var end = Number(document.getElementById('teextNumber').value); var timesTable =Number(document.getElementById('txtNumber').value); // Query document for pTag once, rather than per loop iteration var pTag= document.getElementById('pPrint'); // Check that start is less than end, to ensure that the loop // terminates (ie doesn't loop infinitely) if(start < end) { for(var i= start; i<= end; i++){ // Present the multiplication in the required format pTag.innerHTML += ('- ' + i + ' * ' + timesTable + ' = ' + (timesTable*i) + '<br/>') } } } 

 <h5>JavaScript - Function to Display Table of an entered Number.</h5> <p><input type="text" id="txtNumber" placeholder="Enter number"/></p> <h5>enter the start value</h5> <p><input type="text" id="textNumber" placeholder="Enter number"/></p> <h5>enter the end value</h5> <p><input type="text" id="teextNumber" placeholder="Enter number"/></p> <p><input type="button" value="Print Table." onclick='printTable()'/> <p id="pPrint"></p> 

Answer 2

如果我正確理解了您的問題，那么我將添加乘法函數，如下所示：

 function printTable(){ var ps =Number(document.getElementById('txtNumber').value); var start =Number(document.getElementById('textNumber').value); var end =Number(document.getElementById('teextNumber').value); for(var i=start; i<=end; i++){ var pTag= document.getElementById('pPrint'); pTag.innerHTML += "- " + (ps) + "*" + (i) + " = " + ps*i + "<br/>" } } 

 <body style="text-align: center;"> <h1>JavaScript - Function to Display Table of an entered Number.</h1> <p><input type="text" id="txtNumber" placeholder="Enter number"/></p> <h1>enter the start value</h1> <p><input type="text" id="textNumber" placeholder="Enter number"/></p> <h1>enter the end value</h1> <p><input type="text" id="teextNumber" placeholder="Enter number"/></p> <p><input type="button" value="Print Table." onclick='printTable()'/> <!--print numbers--> <p id="pPrint"></p> </body> 

ps是起始倍數，start是起始倍數，end是結束數。

編輯：添加缺少的框

Answer 3

將起點和終點添加到for循環中，如下所示：

---

function printTable(){
    var timesTable =Number(document.getElementById('txtNumber').value);
    var start = document.getElementById("textNumber").value;
    var end = document.getElementById("teextNumber").value;

    for(var i=start; i<=end; i++){
    var pTag= document.getElementById('pPrint');
    pTag.innerHTML += (timesTable*i) + "<br/>"
 }

}