定心动态添加到的div

所有元素因此，我有这个div：定心动态添加到的div

<div id="termSheetPrinted"> 

</div>

此DIV通过该方法填充：

function GenerateTermSheet() 
     { 
      var urlString = "<%= System.Web.VirtualPathUtility.ToAbsolute("~/mvc/Indications.cfc/RenderPartialTermSheetView")%>"; 
      var jsonNickname = 
       { 
        id : GetGUIDValue(), 
        viewName : 'Nickname' 
       } 
       $.ajax({ 
        type: "POST", 
        url: urlString, 
        data: jsonNickname, 
        success: function(data) { 
         $('#termSheetPrinted').append(data); 
        } 
       }); 
      $('#termSheetPopup input[type="checkbox"]:checked').each(function(){ 
       var checkedName = $(this).attr("name"); 
       var json = 
       { 
        id : GetGUIDValue(), 
        viewName : checkedName 
       } 
       $.ajax({ 
        type: "POST", 
        url: urlString, 
        data: json, 
        success: function(data) { 
         $('#termSheetPrinted').append(data); 
        } 
       }); 
      }) 
      $('#termSheetPopup').dialog('close'); 
      $('#termSheetPrinted').dialog('open'); 
     }

所以局部视图是从服务器获取，并且附加到div，因为他们成功回来。但是，所有内容都在div中保持一致。我尝试添加一种风格，他们被附加到像这样的div：

<div id="termSheetPrinted" style="text-align:center;"> 

</div>

它没有工作，虽然，和我假设的原因是因为最初的DIV之后被渲染其他元素被添加。基本上，用户的体验是，termSheetPrinted DIV上一个jQuery的对话框弹出，并且它是开放的其他元素在他们面前的实时填充，即使代码是不是真的意味着这样的工作方式，这就是方法有用。

知道有什么方法可以让我中心的所有这些元素进来，在div？

编辑：

附加到div的视图的示例。这是从我的控制器返回一个视图中返回，然后Ajax调用抓住它并添加到：

<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<Chatham.Web.Models.Indications.ModelBase>" %> 

<table id="nickNameBTS"> 
    <tr id="tr5"> 
     <td id="td7" style="text-align: right;"> 
      Indication Nickname: 
     </td> 
     <td id="td8" colspan="3"> 
      <%= Html.Encode(Model.STPData.ProjectName)%> 
     </td> 
    </tr> 
</table> 

    <script> 
     $(document).ready(function() { 
      $("#nickNameBTS").bubble({ width: 400, title: 'Nickname' }); 
     }); 

    </script>

来源

2011-02-15 slandau

“我假设原因是因为在渲染初始div后添加了其他元素”。不，CSS会动态地影响DIV *的内部。所以如果你添加内容到你的div，那么它应该是风格。 – JCOC611 2011-02-15 21:11:52

它应该对吗？我不确定为什么它不是。我在想同样的事。 – slandau 2011-02-15 21:19:39

我加了一个答案。希望它能起作用，但如果不能，我会给出这个建议（因为它不依赖于Ajax）：关注最终数据。加载内容，保存页面并在该离线版本上工作，然后您可以将问题作为目标并修复它:) - 我假设您知道Firebug？ - – Baztoune 2011-02-15 21:32:19

添加另一个容器内termSheetPrinted，居中并装入容器内的所有元素。

<div id="termSheetPrinted"> 
    <div id="content" style="width: 500px; margin: 0 auto;"></div> 
</div>

注意，在使用顺序利润率水平居中：0汽车，你需要指定一个绝对宽度。这将做的是将内容容器（及其所有内容）置于termSheetPrinted中。

顺便说一句，我建议不要像这个示例所示的内联样式。请使用CSS文件。

来源

2011-02-15 21:32:16 Kon

你可以试试这个：

<div id="termSheetPrinted" style="text-align:center; margin-left: auto; margin-right: auto"> 

</div>

参见：http://dorward.me.uk/www/centre/

来源

2011-02-15 21:12:17 Erik

假设你”更正确（由于它晚到DOM而没有正确设置样式），我能想到的最简单的答案是在呼叫.append之后重新应用样式。你可以在success参数.append调用之后一行.css('text-align','center');做到这一点：

  $.ajax({ 
       ... 
       success: function(data) { 
        $('#termSheetPrinted').append(data); 
        $('#termSheetPrinted').css('text-align','center'); 
       }

如果它没有被集中的另一个原因是，虽然，这不会解决它。

来源

2011-02-15 21:12:50 eykanal

的内部元素与阿贾克斯添加不应该影响他们的呈现方式，因为修改DOM应触发回流的事实。

仅在内嵌元素，或者任何元素，但只有在IE5和IE6 text-align:center工作。对于块元素，你必须解决您的元素的width，并定义自动margin。

#elementToCenter { 
    margin-left: auto; 
    margin-right: auto; 
    width: 960px; 
}

将此结合文本对齐来修复IE行为。根据你的代码，这里是solutions for centering elements。

来源

2011-02-15 21:26:40 Baztoune

定心动态添加到的div

回答

相关问题