javascript - ac# webapp で矢印キーを使用する

Question

コードビハインドとして c# を使用して webapp を作成しようとしています。ターゲットは、矢印キーを使用して前後に切り替えることで、あるサイトから別のサイトに変更できるようにすることです。これらのボタンはすでに「ページ切り替え」を行っているため、呼び出すのが最も簡単だと思う前方および後方ボタンがあります。私はC＃全体にかなり慣れていないので、まだあまり知らないので、皆さんが行ったコードの提案にコメントを付けていただければ幸いです。

これは、ページの場所を取得するために最もよく使用される C# コードであり、ボタンが何をしなければならないかを示しています。私は自分の会社で働いている人からプロジェクトを引き継いだコードを作成しなかったため、彼らがすべてを正確にどのように行ったのかわかりません。

public class GetPageMeta {

public DataTable lDataTable = new DataTable();
public DataSet lPageDataset;
public SqlDataAdapter lDataAdapter;

public  GetPageMeta()
{
    GetDataSet();
}

private void GetDataSet()
{
    SqlConnection lConnection = new SqlConnection(ConfigurationManager.ConnectionStrings["crmmonitorSQLConnectionString"].ConnectionString);
    lConnection.Open();

    //lDataAdapter = new SqlDataAdapter("SELECT T_Pages.ID,T_Pages.CategoryFK,T_Categories.CategoryName,T_Pages.Name,T_Pages.URL,T_Pages.PositionID,T_Pages.DisplayDuration, T_Pages.GraphicsQuant, T_Pages.Description FROM T_Pages LEFT JOIN T_Categories ON T_Pages.CategoryFK = T_Categories.ID ORDER BY T_Pages.PositionID;", lConnection);
    lDataAdapter = new SqlDataAdapter("SELECT T_Pages.ID,T_Pages.CategoryFK,T_Pages.Name,T_Pages.URL,T_Pages.PositionID,T_Pages.DisplayDuration, T_Pages.GraphicsQuant, T_Pages.Description FROM T_Pages ORDER BY T_Pages.PositionID;", lConnection);


    lPageDataset = new DataSet("PageDataSet");
    lDataAdapter.FillSchema(lPageDataset, SchemaType.Source, "T_Pages");
    lDataAdapter.Fill(lPageDataset, "T_Pages");
    lDataTable = lPageDataset.Tables["T_Pages"];
    SqlCommandBuilder cmdbld = new SqlCommandBuilder(lDataAdapter);
    lConnection.Close();
}

private void GetGraphicDataSet()
{

}

public DataRow PMetaDataRow(string url)
{
    try
    {
        DataRow PMetaDataRow;
        DataRow[] lMetaDataRow;
        string search = "URL='" + url + "'";

        //lMetaDataRow = lDataTable.Select(search);
        lMetaDataRow = lDataTable.Select("URL='" + url + "'");
        PMetaDataRow = lMetaDataRow[0];

        return PMetaDataRow;
    }
    catch
    {
        return null;
    }
}

public DataRow PMetaDataRow(int PageID)
{
    try
    {
        DataRow PMetaDataRow;
        DataRow[] lMetaDataRow;
        string search = "ID='" + PageID + "'";

        //lMetaDataRow = lDataTable.Select(search);
        lMetaDataRow = lDataTable.Select("ID='" + PageID + "'");
        PMetaDataRow = lMetaDataRow[0];

        return PMetaDataRow;
    }
    catch
    {
        return null;
    }
}

マスターページファイルは次のとおりです。

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="Masterpage.master.cs" Inherits="Masterpage" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">

        <link href="Style.css" rel="stylesheet" type="text/css" />
        <link href="cssreset.css" rel="Stylesheet" type="text/css" />
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<script type="text/javascript">
    function hideDiv() {
        if ($(window).width() < 1580) {
            $("#crop2").fadeOut("slow");
        } else {
            $("#crop2").fadeIn("slow");
        }
    }

    //run on document load and on window resize
    $(document).ready(function () {

        //on load
        hideDiv();

        //on resize
        $(window).resize(function () {
            hideDiv();
        });

    });
</script>
<script type="text/javascript">
    function hideDiv2() {
        if ($(window).width() < 1580) {
            $("#crop").fadeOut("slow");
        } else {
            $("#crop").fadeIn("slow");
        }
    }
    $(document).ready(function () {

        //on load
        hideDiv2();

        //on resize
        $(window).resize(function () {
            hideDiv2();
        });
    });
</script>

        <title>MY APP</title>
    </head>

    <body  scroll="no">
        <form id="form1" runat="server">

            <div id="logo">
               <a href="/home.aspx">
                <asp:Image ID="Logol_loop_small" runat="server" ImageUrl="~/Pictures/logol_loop_small.gif" Border="0"/>
               </a>
            </div>
    <div id="topnav">
            <div class="menu2"> 

            <asp:Menu  ID="mnuContent" runat="server"  Font-Names="Trebuchet MS"
            CssClass="SomeMenuClass"
            Orientation="Horizontal" StaticMenuStyle-CssClass="StaticMenuStyle" DynamicMenuItemStyle-CssClass="DynamicMenuStyle"
            StaticMenuItemStyle-CssClass="StaticMenuItemStyle" DisappearAfter="1" DynamicEnableDefaultPopOutImage="False"
            ForeColor="Black" StaticEnableDefaultPopOutImage="False" 
            MaximumDynamicDisplayLevels="10" StaticSubMenuIndent="0px" 
                DynamicHorizontalOffset="1" >
            <DynamicMenuItemStyle CssClass="DynamicMenuStyle" 
                    VerticalPadding="3px" HorizontalPadding="26px" ItemSpacing="0px"></DynamicMenuItemStyle>
            <DynamicMenuStyle Width="300px" CssClass="DynamicMenuStyle" />
                <DynamicSelectedStyle Font-Bold="False" />
                <DynamicItemTemplate>
                    <%# Eval("Text") %>
                </DynamicItemTemplate>

            <StaticMenuItemStyle CssClass="StaticMenuItemStyle" Width="138px" 
                Font-Size="12px" VerticalPadding="13px">
            </StaticMenuItemStyle>
            <StaticMenuStyle CssClass="StaticMenuStyle"></StaticMenuStyle>
            <StaticSelectedStyle Font-Bold="False" VerticalPadding="13px" />
            </asp:Menu> 

            </div>

            <div id="homebutton">
                <asp:ContentPlaceHolder ID="CPH_homebutton" runat="server" />
            </div>
       </div>
        <div id="pagetitel">
        <asp:ContentPlaceHolder ID="CPH_Pagetitel" runat="server"></asp:ContentPlaceHolder>

        </div>

                 <div id="visualtitel1">
                <h2>
                    <asp:ContentPlaceHolder ID="CPH_visualtitel1" runat="server" />
                </h2>
            </div>

            <div id="visual1">
                <asp:ContentPlaceHolder ID="CPH_visual1" runat="server" />
            </div>

            <div id="visualtitel2">
                <h2>
                    <asp:ContentPlaceHolder ID="CPH_visualtitel2" runat="server" />
                </h2>
            </div>

            <div id="visualtitel3">
                <h2>
                    <asp:ContentPlaceHolder ID="CPH_visualtitel3" runat="server" />
                </h2>
            </div>

            <div id="visual2">
                <asp:ContentPlaceHolder ID="CPH_visual2" runat="server" />
            </div>

            <div id="visual3">
                <asp:ContentPlaceHolder ID="CPH_visual3" runat="server" />
            </div>

        <div id="NextPrevious">

                <div id="zuruekbutton">
                    <asp:ContentPlaceHolder ID="CPH_zuruekbutton" runat="server" />
                </div>
                <div class="explanationText">
                   <asp:ContentPlaceHolder ID="CPH_explanationText" runat="server" />
                </div>

                <div id="weiterbutton">
                    <asp:ContentPlaceHolder ID="CPH_weiterbutton" runat="server"/>    
                </div>

        </div>



            <div id="crop">
                <asp:Image ID="cropleft" runat="server" ImageUrl="~/Pictures/crop2.jpg" Width="100%" />
            </div>

            <div id="crop2">
                <asp:Image ID="cropright" runat="server" ImageUrl="~/Pictures/crop3.png" ImageAlign="Right" Width="100%"  />
            </div>

            <div id ="footerleft">
                <% lblCopyright.Text = "&#169; Copyright CompanyName" + DateTime.Today.Year + " | MY APP"; %>
                <asp:Label ID="lblCopyright" runat="server"></asp:Label>
            </div>

            <div id ="footercenter">
                <asp:Label ID="lblInfo" runat="server"></asp:Label>             
            </div>

            <div id="footerright">
                <%  tbDateTime.Text = DateTime.Today.ToLongDateString();   %>
                <asp:Label ID="tbDateTime" runat="server" ></asp:Label>
            </div>

        </form>

    </body>
</html>

2 つの「ボタン」は次のとおりです。

<asp:Content ID="Content6" ContentPlaceHolderID="CPH_weiterbutton" Runat="Server">
    <a ID="ancNext" runat="server" class="standardbutton" target="_self">Weiter</a>
</asp:Content>

<asp:Content ID="Content7" ContentPlaceHolderID="CPH_zuruekbutton" Runat="Server">
      <a id="ancPrevious" runat="server" class="standardbutton_back" target="_self">Zurück</a>
</asp:Content>

score 0 · Accepted Answer

ドキュメントの onkeyup イベントをキャプチャすることで、javascript を使用できます。押されたキーのキーコードがわかっている場合は、必要な機能を実行する対応するボタン、アンカー、または入力を JavaScript で「クリック」することができます。

以下に、理解を深めるための小さなサンプルスクリプトを示します。

document.onkeydown = function(event){

    if(!event.keyCode){
        keycode = window.event.keyCode;
    } else {
        keycode = event.keyCode;
    }


    switch(keycode){
        //left
        case 37:
        $('#zuruekbutton').find('a, input[type=submit], button').click();
        break;

        //right
        case 39:
        $('#zuruekbutton').find('a, input[type=submit], button').click();
        break;

        default:
        break;
    }
};

javascript - ac# webapp で矢印キーを使用する

1 に答える 1

Related

Reference