如何获得/设置Div和Table Width / Height

时间:2022-11-19 13:38:47

I have a Table (or a region) and want to set it's Width and Height value to another Div (or region).

我有一个表(或一个区域),希望将它的宽度和高度值设置为另一个Div(或区域)。

The second one is actually a Ajax Indicator modal which display a loading text when the page is asynchronously post back. here is the example

第二个是Ajax指示符模态,当页面被异步发送回时显示加载文本。这是例子

<table id="MainTable">
    <tr>
        <td>
             Content ....
        </td>
    </tr>
</table>

<div id="Progress">
     Ajax Indocator
</div>

the following javascript didn't work

下面的javascript没有工作

document.getElementById("Progress").style.width = document.getElementById("MainTable").style.width;
document.getElementById("Progress").style.height = document.getElementById("MainTable").style.height;

It should work both on IE and FireFox. how to correct it.

它应该在IE和FireFox上都能工作。如何正确。

I checked some other solution in * but I couldn't fix it.

我在*上查看了其他一些解决方案,但是我无法修复。

I'm waiting to hear from you.

我等待着你的消息。


Update : I use this

更新:我使用这个。

<script>
function SetSize(regionToChange, mainRegion) {
    $(document).ready(function() {
        $('#regionToChange)
 .width($('#mainRegion).outerWidth())
 .height($('#mainRegion).outerHeight());
    }); 
}
</script>

and I call it like

我把它叫做

<asp:Button ID="btnReset" runat="server" SkinID="Button" Text="Reset" OnClick="btnReset_OnClick" OnClientClick="SetSize('Progress', 'MainTable');" />

But it shows me an error which can not find the object

但它给我显示了一个无法找到目标的错误


Update 2 I see this error

更新2我看到这个错误

如何获得/设置Div和Table Width / Height

and in debugger I face with this

在调试器中

如何获得/设置Div和Table Width / Height

2 个解决方案

#1


1  

in jQuery you can do

在jQuery中可以做到这一点

$("#Progress").css('width', function(){
   return $("#MainTable").width()+'px';
});

and so with the height...

随着高度的增加……

edit

编辑

on javascript,

在javascript,

this

document.getElementById("Progress").style.width = document.getElementById("MainTable").style.width;
document.getElementById("Progress").style.height = document.getElementById("MainTable").style.height;

will work if your html is something like this for id="MainTable"

如果html类似于id="MainTable"

<table id="MainTable" style="width: 500px; height: 300px;">
    <tr>
        <td>
             Content ....
        </td>
    </tr>
</table>

because you are accessing style attribute...

因为你正在访问样式属性…

edit2

edit2

 function SetSize(regionToChange, mainRegion) {
        $(regionToChange)
         .width($(mainRegion).outerWidth())
         .height($(mainRegion).outerHeight());

  }

//you can use it as

SetSize('#Progress','#MainTable'); // prefix '#'if it's an ID 

#2


2  

spoken in jQuery:

在jQuery说:

$(document).ready(function(){
   $('#Progress')
     .width($('#MainTable').outerWidth())
     .height($('#MainTable').outerHeight());
});

#1


1  

in jQuery you can do

在jQuery中可以做到这一点

$("#Progress").css('width', function(){
   return $("#MainTable").width()+'px';
});

and so with the height...

随着高度的增加……

edit

编辑

on javascript,

在javascript,

this

document.getElementById("Progress").style.width = document.getElementById("MainTable").style.width;
document.getElementById("Progress").style.height = document.getElementById("MainTable").style.height;

will work if your html is something like this for id="MainTable"

如果html类似于id="MainTable"

<table id="MainTable" style="width: 500px; height: 300px;">
    <tr>
        <td>
             Content ....
        </td>
    </tr>
</table>

because you are accessing style attribute...

因为你正在访问样式属性…

edit2

edit2

 function SetSize(regionToChange, mainRegion) {
        $(regionToChange)
         .width($(mainRegion).outerWidth())
         .height($(mainRegion).outerHeight());

  }

//you can use it as

SetSize('#Progress','#MainTable'); // prefix '#'if it's an ID 

#2


2  

spoken in jQuery:

在jQuery说:

$(document).ready(function(){
   $('#Progress')
     .width($('#MainTable').outerWidth())
     .height($('#MainTable').outerHeight());
});