如何在div中加載另一個頁面？

Question

我用循環創建了一些div，然後在裏面有一個隱藏的字段，其中的值是我想要div加載的url。我嘗試了load()函數，但結果很慢。就像我在使用iframe時一樣，加載需要很長時間，並且高度和寬度不會因其孩子而擴大。有沒有其他方法可以做到這一點？

UPDATE

我的HTML代碼的文件名index.html.erb

<div id="surveyDiv" style="overflow-y:auto;" > 
    <% @sections.each do |sec| %> 
    <% #sec = @sections.first %> 
    <br/> 
    <% @div_id = "survey_section_" + (sec.id).to_s %> 
    <div id="<%=h @div_id %>"> 
     <img src="/images/loading.gif" id="loadingPic"/> 
     <input type=hidden id="hid" name="hid" value="<%=h @srcString + "?section=" + (sec.id).to_s %>"/> 
     <!--<iframe id="the_frame" name="the_frame" src="<%#=h @srcString + "?section=" + (sec.id).to_s %>" scrolling="yes" frameborder="no" ></iframe>--> 
    </div> 
    <script type="text/javascript"> 
     /*$('div:last').load($('input[type=hidden]:last').val())*/ 

     $.get($('input[type=hidden]:last').val(), function(data) { 
      $('.surveyDiv div:last').html(data); 
     }); 

     $('div:last').ready(function() { 
      $('#loadingPic').css('display','none') 
     }); 
    </script> 
    <% end %> 
</div> 

---

Samich的回答是不錯的，但後來，當我用它，我現在不能看到加載的HTML ..hehe

Answer 1

Samich是對的，沒關係爲你的任務。關於調整divs：我遇到了類似的問題，在我的一個網站上彈出。 Popup根據加載的內容調整大小，但在Safari和Explorer中發生了一些奇怪的事情。如果文本太長，那麼彈出窗口最大寬度不好，我寧願換文字。理想的方法是定義內容中的內容的寬度。例如，你有HTML被加載到容器中：

<div class="d1">some text</div> 

爲了提供跨瀏覽器一致性您應該通過CSS限定.D1寬度或限定內聯樣式爲div標籤。

Answer 2

我真的不明白... ASP？

但嘗試這個

<div id="surveyDiv" style="overflow-y:auto;" > 
    <% @sections.each do |sec| %> 
    <% #sec = @sections.first %> 
    <br/> 
    <% @div_id = "survey_section_" + (sec.id).to_s %> 
    <div id="<%=h @div_id %>"> 
     <img src="/images/loading.gif" id="loadingPic" /> 
     <input type="hidden" class="helloimhidden" id="hid<%=h @div_id %>" name="hid" value="<%=h @srcString + "?section=" + (sec.id).to_s %>" /> 
    </div> 
    <% end %> 
</div> 
<script type="text/javascript"> 
    $('.helloimhidden').each(function() { 
     var myInput = $(this); 
     $.get(myInput.val(), function(data) { 
      myInput.parent().html(data); 
     }); 
    }); 
</script> 

請讓我知道如何去，恐怕只有最後一個div會顯示結果由於myInput得到改寫...如果是的話試試這個

<script type="text/javascript"> 
    var myI = 0; 
    var myInput = []; 
    $('.helloimhidden').each(function() { 
     myInput[myI] = $(this); 
     $.get(myInput[myI].val(), function(data) { 
      myInput[myI].parent().html(data); 
     }); 
     myI++; 
    }); 
</script>