0

私のマスターページは、次のようなフォームrunat="server"内にあります。

<body>
    <form id="Form1" runat="server">
         <asp:ContentPlaceHolder ID="MainContent" runat="server"/>
    </form>
</body>

私のページの1つに、テキストエリア、ボタン（ASPではなくhtmlコントロール）、および次のようなJavaScriptコードを追加しました。

<textarea id="ContentTextArea" class="ContentTextArea" rows="2" cols="20"></textarea>
<button id="ClearButton" class="Button2" onclick="ClearButtonClick();">CLEAR</button>

    <script type="text/javascript">
        function ClearButtonClick() {
            document.getElementById("ContentTextArea").value = "";
        }
    </script>

クライアントがサーバーにリクエストを送信せずに「クリア」ボタンをクリックしたときにjavascriptコード（テキストエリアのテキストをクリアする）を実行したいのですが<form id="Form1" runat="server">、マスターページにボタンがあるため、サーバーにデータを送信し、ページがリロードされます。

マスターページに含める必要があり<form id="Form1" runat="server">ますが、クライアント側で実行されるコードでもJavaSctiptを使用したいと思います。

ありがとう

編集：

私のマスターページは次のとおりです。

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head id="Head1" runat="server">
    <title></title>
    <link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />
    <asp:ContentPlaceHolder ID="HeadContent" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="Form1" runat="server">
        <div class="header">
             <div class="clear hideSkiplink">
                <asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal">
                    <Items>
                        <asp:MenuItem NavigateUrl="~/Default.aspx" Text="Home"/>
                        <asp:MenuItem NavigateUrl="~/About.aspx" Text="About"/>
                        <asp:MenuItem NavigateUrl="~/ContactUs.aspx" Text="Contact Us"/>
                    </Items>
                </asp:Menu>
            </div>

            <div class="loginDisplay">
                <asp:LoginView ID="HeadLoginView" runat="server" EnableViewState="false">
                    <AnonymousTemplate>
                        [ <a href="~/Account/Login.aspx" ID="HeadLoginStatus" runat="server">Log In</a> ]
                    </AnonymousTemplate>
                    <LoggedInTemplate>
                        Welcome <span class="bold"><asp:LoginName ID="HeadLoginName" runat="server" /></span>!
                        [ <asp:LoginStatus ID="HeadLoginStatus" runat="server" LogoutAction="Redirect" LogoutText="Log Out" LogoutPageUrl="~/"/> ]
                    </LoggedInTemplate>
                </asp:LoginView>
            </div>
        </div>
        <div class="clear">
        </div>

        <div class="main">
        <asp:ContentPlaceHolder ID="MainContent" runat="server"/>
        </div>

        <div class="footer">
            <p>GH Electronics © 2012. All Rights Reserved.</p>
        </div>

    </form>
    <input type="button" onclick="window.location = '/WareHouse/ContactUs.aspx';" value="avi"/>
    <script type="text/javascript">

           function ClearButtonClick() {
            document.getElementById("ContentTextArea").value = "";
            return false;
        }
    </script>
</body>


</html>

お問い合わせフォームは次のとおりです。

<img alt="Contact Us" src="Images/contact_us.gif" style="float:left;"/>

<p class="contactUs" runat="server">CONTACT US</p>
<label>Full Name:</label>
<asp:TextBox class="FullNameTextBox" runat="server" />
<br /> <br />
<label>Phone Number:</label>
<asp:TextBox class="PhoneNumberTextBox" runat="server" />
<br /> <br />
<label>Email:</label>
<asp:TextBox class="EmailTextBox" runat="server" />
<br /> <br />
<label>Subject:</label>
<asp:TextBox class="SubjectTextBox" runat="server" />
<br /> <br />
<label>Content:</label>
<textarea id="ContentTextArea" class="ContentTextArea" rows="2" cols="20"></textarea>
<br /> <br />
<asp:Button ID="SendButton" class="SendButton" Text="SEND" runat="server" />


<button id="ClearButton" class="Button2" onclick="ClearButtonClick();">CLEAR</button>

<script type="text/javascript">

      function ClearButtonClick() {
       document.getElementById("ContentTextArea").value = "";
       return false;
   }

4

2 に答える 2

2

これでうまくいくと思います：

<button id="ClearButton" class="Button2" onclick="javascript:ClearButtonClick();return false;">CLEAR</button>
于 2012-05-02T12:04:00.507 に答える
1

このようにしてください。2か所で変更を加える必要があります。

  1. onclick = "return ClearButtonClick（）;"にreturnを追加します 下記のイベント登録。

      <button id="ClearButton" class="Button2" onclick="return ClearButtonClick();">CLEAR</button>

  2. javascript関数からfalseを返し、サーバーへのリクエストの送信を停止します。これをページの最後またはheadタグの間に配置します。

    <script type="text/javascript">
    function ClearButtonClick() {
        document.getElementById("ContentTextArea").value = "";
        return false;
    }
</script>
于 2012-05-02T12:04:55.313 に答える