0

我的母版页位于 runat="server" 这样的表单中：

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

在我的一个页面中，我添加了一个文本区域、一个按钮（html 控件，而不是 ASP）和一些类似这样的 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代码（正在清除textarea文本）在客户端单击“清除”按钮而不向服务器发送请求时运行，但是因为我<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

像这样做。您必须在两个地方进行更改。

  1. 在 onclick="return ClearButtonClick();" 中添加返回 活动注册如下。

      <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 回答