如何改变asp控件的宽度/高度?

时间:2012-12-23 04:12:59

标签: javascript asp.net

<script language="javascript" type="text/javascript">
function resize()
{ 
//alert("ok");
       var e = document.GetElementById("ImageEdit");
      e.style.width = "500px";

}
</script>


 <asp:Image ID="ImageEdit" runat="server"  BorderWidth="4"  Width="120px" Height="120px"  name="Image1"  /></td></tr>

 <input id="Button1" type="button" value="button"  onclick="resize();" />

为什么ImageEdit没有改变宽度?

2 个答案:

答案 0 :(得分:2)

是:

getElementById()

而不是:

GetElementById()

不敢相信我之前没有发现过。

完整代码示例:

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script language="javascript" type="text/javascript">
        function resize() {
            var x = '<%= ImageEdit.ClientID %>';
            alert(x);
            var e = document.getElementById('<%= ImageEdit.ClientID %>');
            e.style.width = "500px";
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <asp:Image ID="ImageEdit" runat="server" BorderWidth="4" Width="120px" Height="120px" name="Image1" />

        <input id="Button1" type="button" value="button" onclick="resize();" />
    </form>
</body>
</html>

答案 1 :(得分:1)

Seany84的回答是正确的,但如果您计划在项目中使用大量的java脚本,我建议使用jQuery。这样就可以在公园里散步使用java脚本了!

<head runat="server">
    <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script language="javascript" type="text/javascript">
        $(document).ready(function () {
            $("#Button1").click(function () {
                $("#ImageEdit").width("500px");
            });
        });
    </script>
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <asp:Image ID="ImageEdit" runat="server" BorderWidth="4" Width="120px" Height="120px" name="Image1" />
    <input id="Button1" type="button" value="button" />
    </form>
</body>