Question

我正在使用ASP.NET（C＃）为公交车预订系统安排座位布局。我想允许用户在会话中只选择一个席位。

我有一个图像按钮列表。我希望当我点击一个按钮然后该点击事件应该改变其图像URL时，让我们来自＆＃34; aseat.png＆＃34;到＆＃34; sseat.png＆＃34;。但是当我点击任何其他按钮时，之前点击的按钮的图像URL应该恢复到之前的状态，并且现在应该更改新点击的按钮的图像URL。

我已经创建了布局，当我点击图像按钮时，我可以更改其图像URL并在单击相同的按钮时再次将其更改回来，但是无法使其像我一样工作如上所述。

布局前端代码的片段：

<ul class="row1">    
    <li><asp:ImageButton runat="server" ImageUrl="Images/aseat.png"  OnClick="seat1_Click" ID="seat44" ToolTip ="44" Width="25" Height="25"/></li>           
    <li><asp:ImageButton runat="server" ImageUrl="Images/aseat.png"  OnClick="seat1_Click" ID="seat39" ToolTip="39" Width="25" Height="25"/></li>
    <li><asp:ImageButton runat="server" ImageUrl="Images/aseat.png"  OnClick="seat1_Click" ID="seat34" ToolTip="34" Width="25" Height="25"/></li>
    <li><asp:ImageButton runat="server" ImageUrl="Images/aseat.png"  OnClick="seat1_Click" ID="seat29" ToolTip="29" Width="25" Height="25"/></li>
    <li><asp:ImageButton runat="server" ImageUrl="Images/aseat.png"  OnClick="seat1_Click" ID="seat24" ToolTip="24" Width="25" Height="25"/></li>
    <li><asp:ImageButton runat="server" ImageUrl="Images/aseat.png"  OnClick="seat1_Click" ID="seat19" ToolTip="19" Width="25" Height="25"/></li>
    <li><asp:ImageButton runat="server" ImageUrl="Images/aseat.png"  OnClick="seat1_Click" ID="seat14" ToolTip="14" Width="25" Height="25"/></li>
    <li><asp:ImageButton runat="server" ImageUrl="Images/aseat.png"  OnClick="seat1_Click" ID="seat9" ToolTip="9" Width="25" Height="25"/></li>
    <li><asp:ImageButton runat="server" ImageUrl="Images/rseat.png"  OnClick="seat1_Click" ID="seat4" ToolTip="4" Width="25" Height="25"/></li>
    <li><asp:ImageButton runat="server" ImageUrl="Images/rseat.png"  OnClick="seat1_Click" ID="seat1"  ToolTip="1" Width="25" Height="25"/></li>
</ul>

C＃代码：

protected void seat1_Click(object sender, ImageClickEventArgs e)
{   
  ImageButton button = (ImageButton)sender;

  if(button.ImageUrl == "Images/aseat.png")
  {
    button.ImageUrl = "Images/sseat.png";
  }
  else
  {
     button.ImageUrl = "Images/aseat.png";
  }
}

任何帮助都将不胜感激。

Answer 1

请试一试。

<%@ Page Title="Home Page" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="seat._Default" %>

<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">
<ul class="row1" runat="server" id="Seats">
<li><asp:ImageButton runat="server" ImageUrl="Images/aseat.png" originalUrl="Images/aseat.png"  OnClick="seat1_Click" ID="seat44" ToolTip ="44" Width="25" Height="25"/></li>           
<li><asp:ImageButton runat="server" ImageUrl="Images/aseat.png" originalUrl="Images/aseat.png"  OnClick="seat1_Click" ID="seat39" ToolTip="39" Width="25" Height="25"/></li>
<li><asp:ImageButton runat="server" ImageUrl="Images/aseat.png" originalUrl="Images/aseat.png"  OnClick="seat1_Click" ID="seat34" ToolTip="34" Width="25" Height="25"/></li>
<li><asp:ImageButton runat="server" ImageUrl="Images/aseat.png" originalUrl="Images/aseat.png"  OnClick="seat1_Click" ID="seat29" ToolTip="29" Width="25" Height="25"/></li>
<li><asp:ImageButton runat="server" ImageUrl="Images/aseat.png" originalUrl="Images/aseat.png"  OnClick="seat1_Click" ID="seat24" ToolTip="24" Width="25" Height="25"/></li>
<li><asp:ImageButton runat="server" ImageUrl="Images/aseat.png" originalUrl="Images/aseat.png"  OnClick="seat1_Click" ID="seat19" ToolTip="19" Width="25" Height="25"/></li>
<li><asp:ImageButton runat="server" ImageUrl="Images/aseat.png" originalUrl="Images/aseat.png"  OnClick="seat1_Click" ID="seat14" ToolTip="14" Width="25" Height="25"/></li>
<li><asp:ImageButton runat="server" ImageUrl="Images/aseat.png" originalUrl="Images/aseat.png"  OnClick="seat1_Click" ID="seat9" ToolTip="9" Width="25" Height="25"/></li>
<li><asp:ImageButton runat="server" ImageUrl="Images/rseat.png" originalUrl="Images/rseat.png"  OnClick="seat1_Click" ID="seat4" ToolTip="4" Width="25" Height="25"/></li>
<li><asp:ImageButton runat="server" ImageUrl="Images/rseat.png" originalUrl="Images/rseat.png"  OnClick="seat1_Click" ID="seat1"  ToolTip="1" Width="25" Height="25"/></li>
</ul>
</asp:Content>

Default.aspx.cs

using System;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace seat
{
public partial class _Default : Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }
protected void seat1_Click(object sender, ImageClickEventArgs e)
    {
        ImageButton button = (ImageButton)sender;
        foreach (var item in Seats.Controls)
        {
            if (item.GetType() == typeof(ImageButton) && ((ImageButton)item).ImageUrl == "Images/sseat.png" && ((ImageButton)item).ID != button.ID)
            { 
                ((ImageButton)item).ImageUrl = ((ImageButton)item).Attributes["originalUrl"];
                break;
            }
        }
        if (button.ImageUrl == "Images/sseat.png")
        {
            button.ImageUrl = button.Attributes["originalUrl"];
        }
        else
        {
            button.ImageUrl = "Images/sseat.png";
        }
    }
   }
 }

如何在根据条件单击后更改ImageButton的图像URL？

1 个答案: