使用JavaScript实时转换单位的简单表

在我的JavaScript作业中，我想创建一个转换长度单位的简单表。我尝试使用函数“onchange”，但似乎什么也没发生。其思想是，当用户编辑“Meters”元素时，脚本将使用“changem”功能更改所有其他可编辑元素。任何提示都会对你们有所帮助。多谢各位

<table>

    <tr>

        <td>Meters</td>
        <td contenteditable="true" id="m" onchange="changem()">Enter value</td>

    </tr>

    <tr>

        <td>Centimeters</td>
        <td contenteditable="true" id="cm">Enter value</td>

    </tr>

    <tr>

        <td>Feet</td>
        <td contenteditable="true" id="feet">Enter value</td>

    </tr>

    <tr>

        <td>Yards</td>
        <td contenteditable="true" id="yards">Enter value</td>

    </tr>

    <tr>

        <td>Bananas</td>
        <td contenteditable = "true" id="bananas">Enter value</td>

    </tr>

</table>

<script type="text/javascript">

    function changem() {

        var x = parseInt(document.getElementById('m').innerHTML);

        document.getElementById('cm').innerHTML = x * 100;
        document.getElementById('feet').innerHTML = x * 3.28;
        document.getElementById('yards').innerHTML = x * 1.09;
        document.getElementById('bananas').innerHTML = x * 4.5;


    }

</script>

米
输入值
厘米
输入值
脚
输入值
码
输入值
香蕉
输入值
函数changem（）{
var x=parseInt（document.getElementById（'m'）.innerHTML）；
document.getElementById（'cm'）.innerHTML=x*100；
document.getElementById（'feet'）.innerHTML=x*3.28；
document.getElementById（'yards'）.innerHTML=x*1.09；
document.getElementById（'bananas'）.innerHTML=x*4.5；
}

尝试将其附加到

onkeyup

事件

<td contenteditable="true" id="m" onkeyup="changem()">Enter value</td>

输入值

From（onchange）：

当用户更改

元素的选定选项时，执行JavaScript

---

这就是代码无法工作的原因-没有select元素。

请尝试将其附加到

onkeyup

事件

<td contenteditable="true" id="m" onkeyup="changem()">Enter value</td>

输入值

From（onchange）：

当用户更改

元素的选定选项时，执行JavaScript

---

这就是代码不起作用的原因-没有select元素。

contenteditable

元素不支持

onchange（）

事件，但在某些浏览器中它们确实支持

oninput（）

事件：

<td contenteditable="true" id="m" oninput="changem()">Enter value</td>

米
输入值
厘米
输入值
脚
输入值
码
输入值
香蕉
输入值

contenteditable

元素不支持

onchange（）

事件，但在某些浏览器中它们确实支持

oninput（）

事件：

<td contenteditable="true" id="m" oninput="changem()">Enter value</td>

米
输入值
厘米
输入值
脚
输入值
码
输入值
香蕉
输入值

Onchage事件仅适用于表单元素

更改您的代码，例如：

<td>
  <input id="cm" value="" placeholder="Enter value">
</td>

---

Onchage事件仅适用于表单元素

更改您的代码，例如：

<td>
  <input id="cm" value="" placeholder="Enter value">
</td>

对不起，我的意思是说没有选择元素，这就是它不工作的原因-编辑对不起，我的意思是说没有选择元素，这就是它不工作-编辑的原因