通过onchange函数获得可编辑​​标签的价值？

Question

我想在Javascript中获取设置为可编辑的标签的值。下面

<td class="cent" contenteditable='true' id="value_per_visit" 
onchange="myFunction()"> -- </td> 

代码给出这里是我的javascript代码

<script type="text/javascript"> 
function myFunction() { 
    var x = document.getElementById("value_per_visit").value; 
    document.getElementById("value_per_visit").innerHTML ="gotit"; 
    alert("asad"); 
} 


</script> 

，但我不能够达到的功能。有没有解决方法？

Answer 1

我不是真正确保你能添加的onchange或oninput事件属性TD元素..

的oninput属性火灾时的一个或元素的值被改变。 oninput事件与onchange事件类似，但onInput事件在元素值发生变化后立即发生，而onchange则在元素失去焦点时发生。另一个区别是onchange事件也适用于'keygen'和'select'元素。 https://www.w3schools.com/tags/ev_oninput.asp

阅读，它似乎你不能使用既不oninput也不与<td>

的onchange将您的元素事件侦听器应该做的伎俩，我觉得这是更清洁，因为没有必要添加额外的功能到您的基础HTML。

//html 
<table> 
    <td class="cent" contenteditable='true' id="value_per_visit">data here</td> 
</table> 

//js 
var td = document.getElementById('value_per_visit') 

td.addEventListener('input', function(){ 
    console.log(td.innerHTML) 
}) 

Answer 2

的最好方法是使输入的td元素内：

<table> 
<tr> 
    <td> 
    <input id="Test" value="0" /> 
    </td> 
</tr> 
</table> 

并结合在其上的改变事件：

$('#Test').change(function(){ 
    alert($(this).val()); 
})