单击图像按钮时更改图像网址答案

【问题标题】：change image url when click image button单击图像按钮时更改图像网址
【发布时间】：2010-09-19 00:24:33
【问题描述】：

我有三个图像按钮，它们具有默认图像 url，当用户单击任何图像按钮时，我尝试更改图像 url，当用户单击其他图像按钮时，默认检索尝试这样做，但我没有

<aspx>
<div class="hom_but_sa hom_but_saR">
    <asp:ImageButton ID="BTNPromotion" ImageUrl="images/home-bu_npro.jpg"
        runat="server" Width="134" Height="34" border="0"
        OnClick="BTNPromotion_Click" />
</div>
<div class="hom_but_a hom_but_sbR">
    <asp:ImageButton ID="BTNNewProduct" ImageUrl="images/home-bu_pro.jpg"
        runat="server" Width="134" Height="34" border="0" 
        OnClick="BTNNewProduct_Click" />
</div>
<div class="hom_but_a">
    <asp:ImageButton ID="BTNEvent" runat="server" ImageUrl="images/home-bu_news.jpg"
        Width="134" Height="34" border="0" OnClick="BTNEvent_Click" />
</div>
</div>

<cs>
protected void BTNEvent_Click(object sender, ImageClickEventArgs e)
{        
    BTNEvent.ImageUrl = "images/home-bu_news.jpg";      
}
protected void BTNNewProduct_Click(object sender, ImageClickEventArgs e)
{
    BTNNewProduct.ImageUrl = "images/home-bu_pro_r.jpg";
}
protected void BTNPromotion_Click(object sender, ImageClickEventArgs e)
{     
    BTNPromotion.ImageUrl = "images/home-bu_npro_r.jpg";
}

【问题讨论】：

那么问题出在哪里？我测试了你的代码，它正在工作......有什么遗漏吗？请发布实际发生的事情以及您期望发生的事情。

标签： c# asp.net

【解决方案1】：

根据我的 cmets，我不确定您的实际问题是什么，但也许您想要这样的切换？

protected void BTNEvent_Click(object sender, ImageClickEventArgs e) 
{         
    BTNEvent.ImageUrl = "images/home-bu_news_r.jpg";
    BTNNewProduct.ImageUrl = "images/home-bu_pro.jpg"; 
    BTNPromotion.ImageUrl = "images/home-bu_npro.jpg"; 
} 
protected void BTNNewProduct_Click(object sender, ImageClickEventArgs e) 
{ 
    BTNEvent.ImageUrl = "images/home-bu_news.jpg";
    BTNNewProduct.ImageUrl = "images/home-bu_pro_r.jpg"; 
    BTNPromotion.ImageUrl = "images/home-bu_npro.jpg"; 

} 
protected void BTNPromotion_Click(object sender, ImageClickEventArgs e) 
{      
    BTNEvent.ImageUrl = "images/home-bu_news.jpg";
    BTNNewProduct.ImageUrl = "images/home-bu_pro.jpg"; 
    BTNPromotion.ImageUrl = "images/home-bu_npro_r.jpg"; 
}

一种更简洁的方法是通过将一个事件附加到所有 ImageButton OnClick 来让一个单击事件处理它：

OnClick="BTN_Click"

然后实现Clicklike：

protected void BTN_Click(object sender, ImageClickEventArgs e)
{
    ImageButton btn = (ImageButton)(sender);
    BTNEvent.ImageUrl = (btn.ID.Equals("BTNEvent")) ? 
        "images/home-bu_news_r.jpg" : "images/home-bu_news.jpg";
    BTNNewProduct.ImageUrl = (btn.ID.Equals("BTNNewProduct")) ?
        "images/home-bu_pro_r.jpg" : "images/home-bu_pro.jpg";
    BTNPromotion.ImageUrl = (btn.ID.Equals("BTNPromotion")) ?
        "images/home-bu_npro_r.jpg" : "images/home-bu_npro.jpg";
}

【讨论】：

【解决方案2】：

尝试在 ImageButton 上设置 EnableViewState="false"

【讨论】：

【解决方案3】：

这可以通过 Javascript 轻松实现。在所有三个按钮的onclick事件上调用下面的函数，请检查下面的代码，

function imageurl(id)
{
//assuming image button ids as test1,test2,test3

 switch(id)
 {
    case 'test1':
       document.getElementById('test1').href = 'test1newurl';
       document.getElementById('test2').href = 'test2oldurl';
       document.getElementById('test3').href = 'test3oldurl';
    break;

    case 'test1':
       document.getElementById('test1').href = 'test1oldurl';
       document.getElementById('test2').href = 'test2newurl';
       document.getElementById('test3').href = 'test3oldurl';
    break;

    case 'test1':
       document.getElementById('test1').href = 'test1oldurl';
       document.getElementById('test2').href = 'test2oldurl';
       document.getElementById('test3').href = 'test3newurl';
    break;
 }

}

【讨论】：

这将在回发时丢失。
@Aristos：没错，但只是给了他一个替代方案，即如何在 javascript 中完成。同样的逻辑也可以应用在服务器端。
和@Aristos 我已经测试了 OPs 代码，它可以工作并运行服务器端，所以我不确定他的实际问题是什么，所以从我能说的情况来看，这里没有什么可以解决的。