Question

我有以下代码，这些元素被添加到页面中，但不常见的是click事件永远不会触发。有什么想法吗？

function ToggleData(e){
 var parentRow = $(this).parent().parent();
 var rowData = $(':nth-child(2)',parentRow);
 var html = $("<input type='text' id='amendedval' value='" + $.trim(rowData.text()) +"'/>");
 //Add the update tick
 var imgTick = $("<img src='../images/tick.png' id='imgTick'/>");
 rowData.text('');
 rowData.append(html);
 rowData.append(imgTick);
 imgTick.click(updateTickClick);
};

function updateTickClick(e)
{
 alert('hi');
};

感谢。

Answer 1

你能试试吗

$("imgTick").onclick = updateTickClick;

我认为添加事件处理程序可能需要实际的DOM引用，而不是使用innerHTML构建的内容。

- 编辑

看起来问题在于您选择parentRow和rowData - 这是我在FF3.5和IE7中都适用的简化示例。唯一的变化是如何选择rowData：

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>Testing onclick</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script type="text/javascript">
    function ToggleData(e){
        var rowData = $('td');
        var html = $("<input type='text' id='amendedval' value='" + $.trim(rowData.text()) +"'/>");
        //Add the update tick
        var imgTick = $("<img src='tick.png' id='imgTick'/>");
        rowData.text('');
        rowData.append(html);
        rowData.append(imgTick);
        imgTick.click(updateTickClick);
    };
    function updateTickClick(e) {
        alert('hi');
    };
    </script>
</head>
<body>
    <table>
        <tr>
            <td><a href="#" onclick="ToggleData(this); return false;">Click me</a></td>
        </tr>
    </table>
</body>
</html>

Answer 2

您的imgTick正在动态添加到页面中。而不是使用.click（），尝试使用.live：

   imgTick.live("click", updateTickClick);

并且，不，与dhaval所说的相反，它 NOT 必须是匿名的。

Answer 3

imgTick.bind("click", function(){
alert ( "Clicked" );
});

Answer 4

它可以是使用或不使用匿名函数注册的回调

Answer 5

您是否尝试在VS中进行调试以查看此处发生的事情。这里提供的信息似乎不完整，无法推断。对于id为imgTick的div，我会在jQuery中为click事件执行此操作：

$('#imgTick').click(function({

alert('Hi');

}）;

Answer 6

改 var rowData = $（'：nth-child（2）'，parentRow）; 至 var rowData = $（'td：nth-child（2）'，parentRow）;

现在点击事件正确发生。

Jquery和click事件

6 个答案: