Asp.Net + JQuery - 在函数中设置 CSS.准备

本文关键字:设置 CSS 准备 函数 Net JQuery Asp | 更新日期: 2023-09-27 18:34:19

我需要在下面的就绪函数中设置 CSS 值。

   $(document).ready(function ()
   {
      $("<div id='" + 1 + "' class='box'></div>").css("left", 105).css("top",  54).appendTo("#center").draggable();
      $("<input type='text'></input>").appendTo("#" + 1);
    }

它工作正常,然后在可拖动的div 中创建一个文本框,并将它们放在顶部:54 和左侧 105。现在我需要从服务器查询中获取 X,Y,我已经尝试过这个:

    $(document).ready(function ()
    {
        $.ajax({
            type: "POST",
            url: "Default.aspx/Get",
            data: "{}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg)
            {
                var singleControls = msg.d.split('.');
                $.each(singleControls, function (key, value)
                {
                    var singleParameters = value.split(',');
                    if (singleParameters[0] != "")
                    {
                        var ids = singleParameters[0];
                        var type = singleParameters[1];
                        var cordX = singleParameters[2];
                        var cordY = singleParameters[3];
                        var container = $("#center").position();
                        var x_Coord = cordX - container.left;
                        var y_Coord = cordY - container.top;
                        $("<div id='" + ids + "' class='box'></div>").css("left", cordX).css("top", cordY).appendTo("#center").draggable();
                        $("<input type='text'></input>").appendTo("#" + ids);
                    }
                });
            }
        });

其中 Get() 返回 X,Y,它创建了div,但它将其置于 0,0。有人可以解释为什么这不起作用吗?

示例:https://skydrive.live.com/redir.aspx?cid=d7fc3da7fdbc700d&resid=D7FC3DA7FDBC700D!302&parid=D7FC3DA7FDBC700D!301

Asp.Net + JQuery - 在函数中设置 CSS.准备

如果您正在对左侧和顶部样式进行硬编码,那么为什么不将它们添加到样式表中的 .box 样式中,

如下所示
.box{
position:absolute;
left:105px;
top:54px;
}

否则,CSS 函数应如下所示:

.css({
    position:'absolute',
     left:'105px',
    top:'54px',
    });​

这是一个 jsfiddle.net 示例