本人新手,最近在学着弄用户控件,遇到些问题向各位请教。
我在用户控件中放置一个button,点击弹出div
<input id="btnSelect" type="button" style="height: 22px; width: 10px; border: 1px outset white;" value="选择" onclick="Show();" runat="server" />
<div id="divOption" runat="server" style="width: 200px; border: solid 1px #CCCCFF;
overflow: auto; display: none; z-index: 50; background-color: #FFFFFF; position:absolute">
这是弹出的div这是弹出的div这是弹出的div这是弹出的div这是弹出的div
</div>
然后用户控件内部定义js函数
function Show()
{
var option = document.getElementById("<%=divOption.ClientID%>");
if (option.style.display == "block")
{
option.style.display = "none";
}
else
{
option.style.display = "block";
}
}
通过测试,我发现如果我在aspx页面引用多个用户控件,不管点击哪个button弹出的都是最后一个div。我看过html页面源代码,发现每个用户控件解析的时候都去生成一个Show()函数,并且把<%=divOption.ClientID%>求值对应上,由于js对于重复定义的函数已最后一次定义为准,所以出现如此问题。
我的问题是,我该如何解决这样的问题?
------解决方案--------------------------------------------------------
var option = document.getElementById("<%=divOption.ClientID%>");
=>
var option = document.getElementById("<%=divID%>");
以下代码写在用户控件中
protected string divID;
divID=divOption.ClientID;
------解决方案--------------------------------------------------------
到我的博客中去看,我在《自己动手写WEB控件》中已经说过了