当前位置: 代码迷 >> .NET组件控件 >> 关于web用户控件中的js,
  详细解决方案

关于web用户控件中的js,

热度:2469   发布时间:2013-02-25 00:00:00.0
关于web用户控件中的js,求助!!!
本人新手,最近在学着弄用户控件,遇到些问题向各位请教。
我在用户控件中放置一个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控件》中已经说过了
  相关解决方案