Repeater控件中嵌套的table,实现单击行变色和单击行弹出页面 1,单击第一行变色,然后点击第二行时,第一行恢复到初始颜色,第二行变色..前提是我不知道有多少行.每行都要实现这种效果2.单击某行时 不仅变色,而且会弹出页面. 解决方案 » 免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货 var S={tempColorValue: { sBgColor: null, item_id: null, sColor: null, tempButtonBgColor: null }, changeBgColor: function(obj) { /*鼠標經過時的背景色*/ if (obj.id != this.tempColorValue.item_id) { this.tempColorValue.sBgColor = obj.style.backgroundColor; this.tempColorValue.sColor = obj.style.color; obj.style.cursor = "pointer"; obj.style.backgroundColor = "#d0f3ff"; } }, clearBgColor: function(obj) { /*鼠標離開后的背景色*/ if (obj.id != this.tempColorValue.item_id) { obj.style.backgroundColor = this.tempColorValue.sBgColor; obj.style.color = this.tempColorValue.sColor; } }, setBgColor: function(obj) { /*設置當前元素的背景色*/ obj.style.backgroundColor = "#3E94F1"; obj.style.color = "#fff"; var item_id = this.tempColorValue.item_id; if (item_id != null) { $(item_id).style.backgroundColor = this.tempColorValue.sBgColor; ; $(item_id).style.color = this.tempColorValue.sColor; } if (item_id == obj.id) { this.tempColorValue.item_id = null; } else { this.tempColorValue.item_id = obj.id; } }}function Show(obj){ var url = "xxx.aspx?a="+obj; window.showModalDialog(url,"","");}Repeater_DataBound:e.Item.Attributes.Add("id",e.Item.ItemIndex.ToString());e.Item.Attributes.Add("onclick","S.setBgColor(this);Show('001')");e.Item.Attributes.Add("onmouseover","S.changeBgColor(this)");e.Item.Attributes.Add("onmouseout","S.clearBgColor(this)"); 都很简单啊 楼上的就行额 不行就百度 google 一下 给 tr 添加一个onclick 的JS 方法,在方法里面改变背景色。这样试验下看看。 参照http://dotnet.aspx.cc/file/Change-GridView-Row-Background-Color-When-Click-Row.aspx做法类似 如果弹出窗口,再加上一行window.open即可 repeater的模版有交替项 就是奇偶之分 你直接用就OK了 /// <summary>/// 双色表格以及光棒效果/// </summary>/// <param name="o">GridView的ID</param>/// <param name="a">1 3 5 7 9 单行背景颜色</param>/// <param name="b">2 4 6 8 10 双行背景颜色</param>/// <param name="c">onmouseover 鼠标移动单个表格的颜色</param>function senfe(o, a, b, c){ var t = document.getElementById(o) if (t != null) { t = t.getElementsByTagName("tr"); for (var i = 1; i < t.length; i++) { t[i].style.backgroundColor = (t[i].sectionRowIndex % 2 == 0) ? a : b; t[i].onclick = function() { this.x = "0"; this.style.backgroundColor = (this.sectionRowIndex % 2 == 0) ? a : b; } t[i].onmouseover = function() { if (this.x != "1") this.style.backgroundColor = c; } t[i].onmouseout = function() { if (this.x != "1") this.style.backgroundColor = (this.sectionRowIndex % 2 == 0) ? a : b; } } }}//senfe("g1","#ECF9FC","#FFFFFF","#D6F1F8"); 调用这个是GridView 你可以参考下 这个超级强大 而且兼容如果你还想弹出的话 你在this.style.backgroundColor 后面写就行了 就是每行的onclick改变样式就行了。。 给 tr 添加一个onclick 的JS 方法,在方法里面改变背景色。这样试验下看看。看见源代码就可以拉,不过,楼主要懂js <tr onclick='CChange(<%# Eval("ID")%>,<%# Container.ItemIndex.ToString() %>)' id='<%# "tr"+Container.ItemIndex.ToString() %>'></tr><script type="text/javascript" language="javascript"> var num=false; var curID=-1; function CChange(id,showid) { if(curID==-1) { document.getElementById("tr"+showid).style.backgroundColor="#CCCCCC"; window.open(''); } else { if(curID!=showid && curID!=-1) { document.getElementById("tr"+curID).style.backgroundColor="#FFFFFF"; num=false; } curID=showid; if(!num) { num=true; document.getElementById("tr"+curID).style.backgroundColor="#CCCCCC"; window.open(); } } } </script> 关于innerhtml中显示datalist问题 求大神帮忙啊!~ Sliverlight 2中和xaml对应的预览中啥都没有了 如何给SQL2005添加用户 在text中回车自动执行button事件的问题 Access2000数据库小问题? 在线等!急!xml绑定treeview问题?谢谢大家! 小弟刚刚接手asp.net,希望各位大虾推荐一本能快速上手的教材 using 语句 如何在一个页面中调用另一个页面中对象的方法???急,在线等。。。。 一个编译器排版的问题.. 如何返回xml
var S={
tempColorValue: { sBgColor: null, item_id: null, sColor: null, tempButtonBgColor: null },
changeBgColor: function(obj) { /*鼠標經過時的背景色*/
if (obj.id != this.tempColorValue.item_id) {
this.tempColorValue.sBgColor = obj.style.backgroundColor;
this.tempColorValue.sColor = obj.style.color;
obj.style.cursor = "pointer";
obj.style.backgroundColor = "#d0f3ff";
}
},
clearBgColor: function(obj) { /*鼠標離開后的背景色*/
if (obj.id != this.tempColorValue.item_id) {
obj.style.backgroundColor = this.tempColorValue.sBgColor;
obj.style.color = this.tempColorValue.sColor;
}
},
setBgColor: function(obj) { /*設置當前元素的背景色*/
obj.style.backgroundColor = "#3E94F1";
obj.style.color = "#fff";
var item_id = this.tempColorValue.item_id;
if (item_id != null) {
$(item_id).style.backgroundColor = this.tempColorValue.sBgColor; ;
$(item_id).style.color = this.tempColorValue.sColor;
}
if (item_id == obj.id) {
this.tempColorValue.item_id = null;
}
else {
this.tempColorValue.item_id = obj.id;
}
}
}
function Show(obj){
var url = "xxx.aspx?a="+obj;
window.showModalDialog(url,"","");
}
Repeater_DataBound:
e.Item.Attributes.Add("id",e.Item.ItemIndex.ToString());
e.Item.Attributes.Add("onclick","S.setBgColor(this);Show('001')");
e.Item.Attributes.Add("onmouseover","S.changeBgColor(this)");
e.Item.Attributes.Add("onmouseout","S.clearBgColor(this)");
http://dotnet.aspx.cc/file/Change-GridView-Row-Background-Color-When-Click-Row.aspx
做法类似
/// <summary>
/// 双色表格以及光棒效果
/// </summary>
/// <param name="o">GridView的ID</param>
/// <param name="a">1 3 5 7 9 单行背景颜色</param>
/// <param name="b">2 4 6 8 10 双行背景颜色</param>
/// <param name="c">onmouseover 鼠标移动单个表格的颜色</param>
function senfe(o, a, b, c)
{
var t = document.getElementById(o)
if (t != null)
{
t = t.getElementsByTagName("tr");
for (var i = 1; i < t.length; i++)
{
t[i].style.backgroundColor = (t[i].sectionRowIndex % 2 == 0) ? a : b;
t[i].onclick = function()
{
this.x = "0";
this.style.backgroundColor = (this.sectionRowIndex % 2 == 0) ? a : b;
}
t[i].onmouseover = function()
{
if (this.x != "1")
this.style.backgroundColor = c;
}
t[i].onmouseout = function()
{
if (this.x != "1")
this.style.backgroundColor = (this.sectionRowIndex % 2 == 0) ? a : b;
}
}
}
}
//senfe("g1","#ECF9FC","#FFFFFF","#D6F1F8"); 调用这个是GridView 你可以参考下 这个超级强大 而且兼容
如果你还想弹出的话 你在this.style.backgroundColor 后面写就行了
看见源代码就可以拉,不过,楼主要懂js
var num=false;
var curID=-1;
function CChange(id,showid)
{
if(curID==-1)
{
document.getElementById("tr"+showid).style.backgroundColor="#CCCCCC";
window.open('');
}
else
{
if(curID!=showid && curID!=-1)
{
document.getElementById("tr"+curID).style.backgroundColor="#FFFFFF";
num=false;
}
curID=showid;
if(!num)
{
num=true;
document.getElementById("tr"+curID).style.backgroundColor="#CCCCCC";
window.open();
}
}
}
</script>