jquery中siblings的疑问,以及asp.net中服务器控件id命名的限制

aaa6263 2012-09-25 03:02:13
asp.net制作的页面,有如下代码

<script type="text/javascript" language="javascript">
function ChangeDiv(link, index) {
link = $(link);
link.addClass("v").siblings("a").removeClass("v");
$("#div-" + index).show().siblings("div[id|='div']").hide();
return false;
}
</script>

<div>
<asp:LinkButton runat="server" OnClientClick="return ChangeDiv(this, 1);" Text="问题1"></asp:LinkButton>
<asp:LinkButton runat="server" OnClientClick="return ChangeDiv(this, 2);" Text="问题2"></asp:LinkButton>
<asp:LinkButton runat="server" OnClientClick="return ChangeDiv(this, 3);" Text="问题3"></asp:LinkButton>
<asp:LinkButton runat="server" OnClientClick="return ChangeDiv(this, 4);" Text="问题4"></asp:LinkButton>
<asp:LinkButton runat="server" OnClientClick="return ChangeDiv(this, 5);" Text="问题5"></asp:LinkButton>
</div>

<div id="div-1">具体问题1</div>
<div id="div-2">具体问题2</div>
<div id="div-3">具体问题3</div>
<div id="div-4">具体问题4</div>
<div id="div-5">具体问题5</div>


希望通过点击五个linkbutton中的一个,显示div-1等五个div中的一个,其余四个隐藏。
这个代码可以实现这一功能,但有几个问题要请教:
1:$("#div-" + index).show().siblings("div[id|='div']").hide();这个代码中应该是指把div-同等级的其他几个div隐藏,但("div[id|='div']")是什么意思呢?是否是指,id中带有div三个字母的div块?
2.现在<div id="div-1">不是服务器控件,要变成服务器控件应该加 runat="server" 就可以,但发现asp.net后台的.cs文件,不认“div-1”这个控件,猜测是因为服务器控件id号不能包含“-”号。于是想把"div-1"等,改成“divD1”,代码改成如下:

<script type="text/javascript" language="javascript">
function ChangeDiv(link, index) {
link = $(link);
link.addClass("v").siblings("a").removeClass("v");
$("#divD" + index).show().siblings("div[id|='div']").hide();
return false;
}
</script>

<div>
<asp:LinkButton runat="server" OnClientClick="return ChangeDiv(this, 1);" Text="问题1"></asp:LinkButton>
<asp:LinkButton runat="server" OnClientClick="return ChangeDiv(this, 2);" Text="问题2"></asp:LinkButton>
<asp:LinkButton runat="server" OnClientClick="return ChangeDiv(this, 3);" Text="问题3"></asp:LinkButton>
<asp:LinkButton runat="server" OnClientClick="return ChangeDiv(this, 4);" Text="问题4"></asp:LinkButton>
<asp:LinkButton runat="server" OnClientClick="return ChangeDiv(this, 5);" Text="问题5"></asp:LinkButton>
</div>

<div id="divD1" runat="server" >具体问题1</div>
<div id="divD2" runat="server">具体问题2</div>
<div id="divD3" runat="server">具体问题3</div>
<div id="divD4" runat="server">具体问题4</div>
<div id="divD5" runat="server">具体问题5</div>

可是发现,这样改后,点击linkbutton后,其余四个div不再隐藏。请大家指教指教,这是为什么?
...全文
198 5 打赏 收藏 转发到动态 举报
写回复
用AI写文章
5 条回复
切换为时间正序
请发表友善的回复…
发表回复
aaa6263 2012-11-22
  • 打赏
  • 举报
回复
看来还是没有用
aaa6263 2012-09-25
  • 打赏
  • 举报
回复
[Quote=引用 2 楼 的回复:]
应该是先隐藏,再显示 。


HTML code

$("#divD" + index).siblings("div[id^='div']").hide();
$("#divD" + index).show();
[/Quote]

似乎还是不行啊,求助啊
aaa6263 2012-09-25
  • 打赏
  • 举报
回复
[Quote=引用 2 楼 的回复:]
应该是先隐藏,再显示 。


HTML code

$("#divD" + index).siblings("div[id^='div']").hide();
$("#divD" + index).show();
[/Quote]

先试试看
zell419 2012-09-25
  • 打赏
  • 举报
回复
应该是先隐藏,再显示 。


$("#divD" + index).siblings("div[id^='div']").hide();
$("#divD" + index).show();
aaa6263 2012-09-25
  • 打赏
  • 举报
回复
请求帮助啊

87,992

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧