我正在尝试完成基于文本更改 asp:Button(用户控件)背景图像的任务。它基本上是一个切换操作(开/关)背景图像。
我想使用 getElementByID 将 Text 元素放入我的 javaScript 函数中的 int 变量中。但这似乎不起作用。这是我的 javascript + asp.net 代码:
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="ButtonControl.ascx.cs" Inherits="WebUI.ButtonControl" %>
<link href="Content/ButtonStyles.css" rel="stylesheet" />
<script src="http://code.jquery.com/ui/1.8.23/jquery-ui.min.js" type="text/javascript"></script>
<script type="text/javascript">
function toggleButtonImage()
{
**THE ERROR IS HERE**
var btnValue = parseInt(document.getElementById('<%=Button.ClientID%>').value);
//if Text value greater than one then display image
if (btnValue > 1)
{
$(document).ready(function ()
{
$("#AcumenButton").click(function ()
{
$("#AcumenButton").addClass("buttonBackgroundOn");
return false;
});
});
}
// else no image
else
{
$(document).ready(function ()
{
$("#Button").click(function ()
{
$("#Button").addClass("buttonBackgroundOff");
return false;
});
});
}
}
</script>
<asp:Button ID="Button" runat="server" Text="3" Width="7.2%" Height="79px" />
这是我的两个类的CSS:
.buttonBackgroundOn
{
background: url(/Images/BlobOnButtonImg.PNG) no-repeat !important;
width: 400%;
height: 100%;
}
buttonBackgroundOff
{
background: url(/Images/PlainBorderButtonImg.PNG) no-repeat !important;
width: 400%;
height: 100%;
}
使用此用户控件的页面在其 .cs 类中具有以下内容:
ClientScript.RegisterStartupScript(this.GetType(), "js", "toggleButtonBorder();", false);
我真的不知道我哪里错了。有什么建议吗?