Javascript jquery在notfire中的click函数 $（文档）.ready（函数（）{ $（“表tr td”）。单击（函数（）{ var div_top=$（this）.position（）.top； var div_left=$（this）.position（）.left； var new_div=“”； $（“.main”）.html（新的_div+$（“.main”）.html（））； }); }); 临时雇员临时雇员_Javascript_Jquery_Html

Javascript jquery在notfire中的click函数 $（文档）.ready（函数（）{ $（“表tr td”）。单击（函数（）{ var div_top=$（this）.position（）.top； var div_left=$（this）.position（）.left； var new_div=“”； $（“.main”）.html（新的_div+$（“.main”）.html（））； }); }); 临时雇员临时雇员

javascript jquery html

Javascript jquery在notfire中的click函数 $（文档）.ready（函数（）{ $（“表tr td”）。单击（函数（）{ var div_top=$（this）.position（）.top； var div_left=$（this）.position（）.left； var new_div=“”； $（“.main”）.html（新的_div+$（“.main”）.html（））； }); }); 临时雇员临时雇员,javascript,jquery,html,Javascript,Jquery,Html,当第一次单击表的“td”时，然后在该“td”中显示div，但在单击另一个“td”后，请在“not fire”中单击函数。您需要使用事件委派，因为您要重复添加该表更改： <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <script src="jq/jquery-1.10.2.js" type="text/javascript"></script>

当第一次单击表的“td”时，然后在该“td”中显示div，但在单击另一个“td”后，请在“not fire”中单击函数。

您需要使用事件委派，因为您要重复添加该表

更改：

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <script src="jq/jquery-1.10.2.js" type="text/javascript"></script>
    <title></title>
    <script type="text/javascript" language="javascript">
        $(document).ready(function () {

            $("table tr td").click(function () {

                var div_top = $(this).position().top;
                var div_left = $(this).position().left;

                var new_div = "<div style='position:absolute;z-index:2;top:" + div_top + "px;left:" + div_left + "px;width:30px;height:23px;background:red;margin:0px auto;'></div>";
                $(".main").html(new_div + $(".main").html());
            });
        });
</script>
</head>
<body>
    <form id="form1" runat="server">
    <div class="main">
        <table class="tbl-bottom">
            <tr><td>temp</td><td></td><td></td></tr>
            <tr><td></td><td>temp</td><td></td></tr>
        </table>
    </div>
    </form>
</body>
</html>

致：

单击即可完全重写表格：

$('div.main').on('click', "table tr td", function () {

因此，包含单击事件的表不再存在

尝试改用

.prepend

：

 $(".main").html(new_div + $(".main").html()); //.html() rewrite table

小提琴：

在重新阅读当前代码后，可能不需要进行编辑还是留着以防万一，可能有用。现在，表不是每次单击都重写的，您需要防止每次单击都在div前面加上前缀

为此，只需将您的

div

转换为jQuery对象，并将其移到click事件之外：

 $(".main").prepend(new_div);

$（文档）.ready（函数（）{
var new_div=$（“”）；
$（“表tr td”）。单击（函数（）{
var div_top=$（this）.position（）.top；
var div_left=$（this）.position（）.left；
新的div.css（{top:div_top，left:div_left}）；
元（“.main”）。预编本（新分区）；
});
});

这样，您就不会每次单击都预先准备一个新的div，而只是移动它并更改它的CSS

小提琴：我想这会有用的：

$(document).ready(function () {
    var new_div = $("<div style='position:absolute;z-index:2;width:30px;height:23px;background:red;margin:0px auto;'></div>");
    $("table tr td").click(function () {
         var div_top = $(this).position().top;
         var div_left = $(this).position().left;

         new_div.css({top : div_top, left : div_left});

         $(".main").prepend(new_div);
     });
});

$（文档）.ready（函数（）{
$（“表tr td”）。单击（函数（）{
var div_top=$（this）.position（）.top；
var div_left=$（this）.position（）.left；
var new_div=“”；
$（this.html（new_div）；
});
});

我想您想在

中添加

新的\u div

。这就是您使用.html（）的原因。在其他情况下，您希望使用

您正在用此行替换所有html

$(document).ready(function () {

            $("table tr td").click(function () {

                var div_top = $(this).position().top;
                var div_left = $(this).position().left;

                var new_div = "<div style='position:absolute;top:" + div_top + "px;left:" + div_left + "px;width:30px;height:23px;background:red;margin:0px auto;'></div>";
                $(this).html(new_div);
            });
        });

这会导致您丢失单击处理程序

您应该在不替换所有html的情况下附加新的div。类似于

$(".main").html(new_div + $(".main").html());

试试这个：

$('.main').append(new_div);

您的代码位于每个函数的内部

这将遍历页面上的所有单元格。

尝试替换。。。 $（“.main”）.html。。。。等具有

$（this.html（new_div）

你想干什么？

$('.main').append(new_div);

$('td').each(function(){
     $(this).click(function(){
        ......
     });
});