設置div的完整高度和寬度，然后單擊另一個div
[英]set div full height and width in click from another div
問題描述
我正在基於菜單欄上的單擊將html文件加載到內容div中。 HTML包含5個表，但由於某種原因，div僅顯示第一個表的前5行，因此您需要使用滾動條來查看其余表。 我想在單個視圖上查看所有表，並且僅當信息超出屏幕時才具有滾動條。 任何建議都會有所幫助。 我試圖在div上將寬度和高度設置為100％，但這沒有用。 當我單獨查看表格HTML時，它看起來就像我想要的那樣。
感謝您提供的所有幫助。
function load_codes() { document.getElementById("content").innerHTML = '<object type="text/html" data="codes2.html" ></object>'; } function load_mrgsql() { document.getElementById("content").innerHTML = '<object type="text/html" data="mergesqlcode.html" ></object>'; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="sidebar"> <h2>Sidebar</h2> <p>Open Merge Analysis WorkBook</p> <p> <a href="#" onclick="load_mrgsql()">Open Merge Analysis SQL file</a> </p> <p> <a href="#" onclick="load_codes()">Common Merge Code List</a> </p> <p>Merge Analysis Statistics</p> <p>My Statistics</p> </div> <div id="content" style="height: auto; width:auto; min-height:100%; display: block; overflow: auto;"> <h1>Merge Analysis Tracking</h1> <p>Welcome to the Merge Analysis Tracking Tool</p> <p>Look around</p> </div> <!-- HTML with Tables (only 2 shown) --> <body> <table class="table"> <thead> <tr> <th colspan="3">Case Close Codes</th> </tr> </thead> <tr> <td>BFU</td> <td>BIOLOGICAL FATHER UNKNOWN</td> </tr> <tr> <td>DGC</td> <td>IV-D GOOD CAUSE</td> </tr> <tr> <td>DNO</td> <td>NCP DECEASED</td> </tr> <tr> <td>ERR</td> <td>CASE ENTERED IN ERROR</td> </tr> <tr> <td>FOR</td> <td>FOREIGN</td> </tr> <tr> <td>INC</td> <td>INCARCERATED, INSTITUTIONALIZED, MEDICAL</td> </tr> <tr> <td>JNC</td> <td>INITIATING JURISDICTION NON COOPERATION</td> </tr> <tr> <td>LCO</td> <td>LOCATE ONLY</td> </tr> <tr> <td>LOC</td> <td>LOSS OF CONTACT</td> </tr> <tr> <td>NCA</td> <td>NO CURRENT ORDER/ARREARS <$500</td> </tr> <tr> <td>NCO</td> <td>NON-COOPERATION</td> </tr> <tr> <td>P21</td> <td>PATERNITY 21</td> </tr> <tr> <td>PBI</td> <td>PATERNITY BEST INTEREST</td> </tr> <tr> <td>PEX</td> <td>PATERNITY EXCLUDED</td> </tr> <tr> <td>QLO</td> <td>QUICK LOCATE ONLY</td> </tr> <tr> <td>RSC</td> <td>RECIPIENT OF SERVICES REQUEST CLOSURE</td> </tr> <tr> <td>UL1</td> <td>UNABLE TO LOCATE 1 YEAR</td> </tr> <tr> <td>UL3</td> <td>UNABLE TO LOCATE 3 YEARS</td> </tr> </table> <table class="-table"> <thead> <tr> <th colspan="4">Relationship Codes</th> </tr> </thead> <tr> <td>01</td> <td>SELF</td> </tr> <tr> <td>02</td> <td>SPOUSE</td> </tr> <tr> <td>05</td> <td>CHILD</td> </tr> <tr> <td>06</td> <td>GRANDCHILD</td> </tr> <tr> <td>07</td> <td>NEPHEW OR NIECE</td> </tr> <tr> <td>08</td> <td>SIBLING</td> </tr> <tr> <td>09</td> <td>FIRST OR SECOND COUSIN</td> </tr> <tr> <td>10</td> <td>OTHER RELATIVE</td> </tr> <tr> <td>13</td> <td>UNBORN</td> </tr> <tr> <td>15</td> <td>STEP CHILD</td> </tr> <tr> <td>16</td> <td>STEP GRANDCHILD</td> </tr> <tr> <td>17</td> <td>STEP NEPHEW OR NIECE</td> </tr> <tr> <td>18</td> <td>STEP BROTHER OR SISTER</td> </tr> <tr> <td>19</td> <td>OTHER SPECIFIED RELATIVE</td> </tr> <tr> <td>20</td> <td>ATTORNEY</td> </tr> <tr> <td>27</td> <td>OTHER</td> </tr> <tr> <td>28</td> <td>FATHER</td> </tr> <tr> <td>29</td> <td>ALLEGED FATHER</td> </tr> <tr> <td>30</td> <td>STEP FATHER</td> </tr> <tr> <td>31</td> <td>GRAND FATHER</td> </tr> <tr> <td>32</td> <td>MOTHER</td> </tr> <tr> <td>33</td> <td>STEP MOTHER</td> </tr> <tr> <td>34</td> <td>GRAND MOTHER</td> </tr> <tr> <td>35</td> <td>SISTER</td> </tr> <tr> <td>35</td> <td>SISTER</td> </tr> <tr> <td>36</td> <td>AGENCY</td> </tr> <tr> <td>36</td> <td>AGENCY</td> </tr> <tr> <td>37</td> <td>AUNT</td> </tr> <tr> <td>37</td> <td>AUNT</td> </tr> <tr> <td>38</td> <td>UNCLE</td> </tr> <tr> <td>38</td> <td>UNCLE</td> </tr> <tr> <td>39</td> <td>BROTHER</td> </tr> <tr> <td>39</td> <td>BROTHER</td> </tr> <tr> <td>40</td> <td>ADOPTED CHILD</td> </tr> <tr> <td>40</td> <td>ADOPTED CHILD</td> </tr> <tr> <td>99</td> <td>UNKNOWN</td> </tr> <tr> <td>99</td> <td>UNKNOWN</td> </tr> </table>
1 個解決方案
解決方案1
0 已采納 2018-06-04 16:22:59
如果我正確理解了您的問題，則希望使對象具有完整高度，而不顯示滾動條，而不是相反。
如果是這樣，您應該可以執行以下操作：
function load_codes() {
let elem = document.getElementById("content")
elem.innerHTML = '<object type="text/html" data="codes2.html" ></object>';
elem.onload = function(e) {
elem.style.height = e.contentWindow.document.body.offsetHeight;
}
}
那應該得到您所需要的。 您可能需要執行其他css才能刪除對象的邊框。
根據另一個div設置DIV的寬度和高度
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.