TD内容的事件监听器

时间:2014-10-13 14:26:32

标签: javascript jquery html

我需要在表上发生任何变化时触发一个函数。我有一个事件监听器,除非<td>中的简单文本除外,否则表格中的任何内容都会发生变化。我需要事件监听器(或其他任何东西)来捕获以下结构中的更改:

<td id="x">Text</td>

请在下面找到我使用的完整代码。当表格的最后一行上的任何内容发生变化时,我需要显示警报(最后 - ID&#34; 2,0&#34;和&#34; 2,1&#34;)。 &#34;更改文字&#34;按钮更改我感兴趣的s中的文本,以捕获事件。

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

</head>
<body>

<table id="foobar">
  <tr>
    <td id="aaa" name="YYY">
        <select name="001" id="0,0">
            <option value="volvo">Volvo</option>
            <option value="saab">Saab</option>
            <option value="mercedes">Mercedes</option>
            <option value="audi">Audi</option>
        </select>
        </td>
    <td id="bbb" name="XXX"><input name="CCC" id="0,1" type="text"></td>
  </tr>
  <tr>
    <td><input name="CCC2" id="1,0" type="text"></td>
    <td><input name="CCC3" ud="1,1" type="text"></td>
  </tr>
   <tr>
    <td id="2,0" name="abc">TEST 1</td>
    <td><div id="2,1">TEST 2</div> </td>
    </tr>

    <br><br>
</table>
<input type='button' onclick='changeText()' value='Change Text'/>


<script>
function changeText(){
    var x=Math.random(100);
    document.getElementById('2,1').innerHTML = x;
}


document.getElementById('foobar').addEventListener('change',function(e)
{
    e = e || window.event;
    var target = e.target || e.srcElement;
    var name = target.id || target.getAttribute('name');
    alert('the ' + name + ' element changed!');
},false);

</script>

</body>
</html>

0 个答案:

没有答案