定心動態添加到的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

回答

相關問題