在OnClick中防止OnServerClick?

时间:2012-10-09 19:22:40

标签: javascript asp.net javascript-events onclick postback

我正在使用ASP.NET,我有一个既有onclick又有onserverclick的链接。两者都很重要,但我希望onclick能够阻止onserverclick运行,如果可能的话。

这是我正在玩的项目:

    <ul class="clickables">
        <asp:Repeater ID="MenuRepeater" runat="server">
            <HeaderTemplate>
            </HeaderTemplate>
            <ItemTemplate>
                <li class=" <%# ((DataRowView)Container.DataItem)["CSSClass"]%>" 
                    style="background-color: <%# ((DataRowView)Container.DataItem)["BackgroundColour"]%>">
                    <a id="A1" 
                        runat="server" 
                        onserverclick="LinkClick"
                        onclick=<%# "return javascript:LinkClick('" + ((DataRowView)Container.DataItem)["Postback"] + "')" %>
                        customid='<%# ((DataRowView)Container.DataItem)["UniqueID"]%>'
                        href='<%# ((DataRowView)Container.DataItem)["PageFile"]%>'>
                    </a>
                    <%# ((DataRowView)Container.DataItem)["DisplayName"]%>
                </li>
            </ItemTemplate>
            <FooterTemplate>
            </FooterTemplate>
        </asp:Repeater>
    </ul>

这是我希望停止回发的JS:

function LinkClick(parameters) {
    if (parameters[0] == "False") {
        return false;
    }

我错过了什么吗?这甚至可能吗?我知道我可以通过在onclick中返回false来阻止正常的回发,但是我可以停止onserverclick吗?

由于

更新 的 经过一段时间的调试(远离webdev一段时间......),JS函数没有触发......

更新2

以下是完整呈现的页面源:

<!DOCTYPE html>
<link rel="stylesheet" type="text/css"
    href="iphone.css" />

<link href="MenuStyles.css" rel="stylesheet" type="text/css">
<meta name="viewport" content="user-scalable=no, width=device-width" />
<script type="text/javascript" src="mootools-core-1.4.5-full-nocompat-yc.js"></script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>

</title></head>
<body>
    <form method="post" action="Main.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="YkYtJBVbLo0YmPPXHO5sO8FI5kAxszDeDe/bdeHgDCummp4bGaZKj3W6ihINzdq9PFQT6uCqE2eRXLhF1OEeKh8qJgRJnXWiisrDZ2ivw6JISfxuhIFP1VKKrZET9NIJqrJKpS2namuXzQL+yDJG8WGGvDrQ7oEBMDT6seSXr3zoowlA6tB4+gdbsPJ4utvNKCrhhTImpeXTzeaYCNV3t8QzsiGA7wK51Pgqo9vFQ6LH31NRYJEJ/yfhnnUcoSG6YR8SHNp+j7cGMVMoZPpgLu4bcMNSixHjGW+yin4YN7sf4wtXqQHIGFOwbSHM0VcAxd3is4lUJVYMoBH4pqAjjgBZMuaXPHwDfmZZk3Dk8feyn2btCh0nwXUrkAiAf8n1+a3hs9VfR0JeNs6x0WVzlMxgm4JFzIkthXtJ+632NaNh4rJyvib+j/Vs+HjtRFQXaIDj1fXp2KFniReSjZANiBaepyJqozJghhYnEB8MP1ZOePmrrbLCxUl1MD5Wn2bgFKkNSK25NC1hQoXdnZbEeA==" />
</div>

<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['form1'];
if (!theForm) {
    theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>
</script>


<div class="aspNetHidden">

    <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="zxCYbgjQBAQXVsCg6EwWqRNbeqa/5PzOIgwdhVB5mEasbEk06ik+VT9njAhsM8vF0ymfwdsNmbuX2R7iMJjdpqLMAVABvva4eorpK2PdajpD+g2RzFXI5SEEG9VjwQUXf3kKgb0KnPjWGYQdgZHGDQ==" />
</div>
    <div>
        <div class="button">Back</div>
        <div class="button-bold">+</div>
        <h1>AAR</h1>
        <h2 id="lblQuestion">Please wait for a question...</h2>
        <ul class="clickables">


                    <li class=" arrow" 
                        style="background-color: White">
                        <a id="MenuRepeater_A1_0" onclick="return&#32;LinkClick(&#39;True&#39;)" customid="80f03602-cb67-4d46-99ea-4200459e6a48" href="javascript:__doPostBack(&#39;MenuRepeater$ctl01$A1&#39;,&#39;&#39;)">
                        </a>
                        Question 1
                    </li>

                    <li class=" " 
                        style="background-color: LightGray">
                        <a id="MenuRepeater_A1_1" onclick="return&#32;LinkClick(&#39;False&#39;)" customid="91f76613-ecaa-47df-a5d6-5a921935b1f9" href="javascript:__doPostBack(&#39;MenuRepeater$ctl02$A1&#39;,&#39;&#39;)">
                        </a>
                        Question 2
                    </li>


        </ul>
        <ul class="clickables">

        </ul>
    </div>
    </form>
    <script>
        $$('.clickables').each(function(clickable) {
            var list = clickable.getElements('li');

            list.addEvent('click', function() {
                var link = this.getElement('a');
                if(this.getFirst('a')) {
                    window.location = link;
                }
            });
        });

        function LinkClick(parameters) {
            if (parameters[0] == "False") {
                return false;
            }
            return true;
        }
    </script>
</body>
</html>

编辑3

即使我这样做:

onclick='return LinkClick(False)'

OR

onclick="return LinkClick(False)"

我仍然得到:

onclick="return&#32;LinkClick(&#39;True&#39;)"

编辑4

这是当前渲染的来源:

<!DOCTYPE html>
<link rel="stylesheet" type="text/css"
    href="iphone.css" />

<link href="MenuStyles.css" rel="stylesheet" type="text/css">
<meta name="viewport" content="user-scalable=no, width=device-width" />
<script type="text/javascript" src="mootools-core-1.4.5-full-nocompat-yc.js"></script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>

</title></head>
<body>
    <form method="post" action="Main.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="ATtNaDBRU6vswFif62qens2E35fTb32GNoGWb9g2UFbg0Pli0sVNrzGeLKgFI41ojer32c0dUpY2F54DIn0L0dQgi7XFwJCum71RivEO8THI+xsj3ACip5IKj0hPTlB0mDtjRUcRAPxTUDJlxNB2ZvpP1nAR8i7b/tsSrF5sP3Xx3JOb59POn4nxVDOTm80j0OAolK09Mo0leI9EzyQWbpig8Q8FaT7eKzCoJ1Z40TNWX24ZKsxsND4ebBfakOnI8qd2lNdBcJ9FrhBCTEJDCQksXs/rhyJXkksaonPGNFdtWMpiIyQDGkT0V6Q+CPt5fFnZZp4fbKZyRVMcs6XdxwHG3qTYJJgnDbfSvnswKce7la8JVSxoWy+dufG6gxIfJK2rKw0mhfQ21y90ZtkaKZ4CeZWB4TveHRhYJVlinC7bwXwKJGXhqcHJeJ0IoinTS+ZgsbuJOo3zHCslpWThP+ib7IVpmFx+nluy31L65Zy7dVoSZeySboBq10C9e1D3Tm0K5Pvcn/ovG7NmRupa+vgrcYEWQgb6QKym1aartoVmtPm1dWZiJzwA9X7j7Wn5mus2XrE5SXqbvp0bANO1rQ==" />
</div>

<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['form1'];
if (!theForm) {
    theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>
</script>


<div class="aspNetHidden">

    <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="vi/Uef51SWAjwpFRuN3fwE5Y2FDB84KMHL6HjRIbWSKMEsSrg2RiGbteExTKFCbKhGe16A7xsn6DzMULMalMxqrg2yi9wkWZb0w2ifgCG6mmU0fH3V6zELQeACrtHDQ+4YlxeZ8k7HfGC592ammq3g==" />
</div>
    <div>
        <div class="button">Back</div>
        <div class="button-bold">+</div>
        <h1>AAR</h1>
        <h2 id="lblQuestion">Please wait for the question...</h2>
        <ul class="clickables">


                    <li class=" arrow" 
                        style="background-color: White">
                        <a id="MenuRepeater_A1_0" onclick="return LinkClick(True);" customid="b88d214b-0d1c-4986-821e-c1650ffbdbfd" href="javascript:__doPostBack(&#39;MenuRepeater$ctl01$A1&#39;,&#39;&#39;)">
                        </a>
                        Question 1
                    </li>

                    <li class=" " 
                        style="background-color: LightGray">
                        <a id="MenuRepeater_A1_1" onclick="return LinkClick(False);" customid="d566775f-4bee-4069-adb0-27e8cf8057d9" href="javascript:__doPostBack(&#39;MenuRepeater$ctl02$A1&#39;,&#39;&#39;)">
                        </a>
                        Question 2
                    </li>


        </ul>
        <ul class="clickables">



        </ul>
    </div>
    </form>
    <script>
        $$('.clickables').each(function(clickable) {
            var list = clickable.getElements('li');

            list.addEvent('click', function() {
                var link = this.getElement('a');
                if(this.getFirst('a')) {
                    window.location = link;
                }
            });
        });

        function LinkClick(parameters) {
            if (parameters[0] == "False") {
                return false;
            }
            return true;
        }
    </script>
</body>
</html>

更新5

因此,如果我离开方法并返回true / false,它应该停止回发吗?这不起作用(更多渲染源)。

<!DOCTYPE html>
<link rel="stylesheet" type="text/css"
    href="iphone.css" />

<link href="MenuStyles.css" rel="stylesheet" type="text/css">
<meta name="viewport" content="user-scalable=no, width=device-width" />
<script type="text/javascript" src="mootools-core-1.4.5-full-nocompat-yc.js"></script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title>

</title></head>
<body>
    <script>
        function LinkClick(parameters) {
            if (parameters[0] == "False") {
                return false;
            }
            return true;
        }
    </script>
    <form method="post" action="Main.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="PiZp7nhFhCoiWV3slT5szv5Z5GAkeDWYHj7QpAPmnwSoKxWg6Zm9HTQGkZXS2Osddx6KwS0eGu/ZMaLjgxVBm1U+Eszzf/OjmAbB78jPAeSwW8GwXRUUp984a7cPZc9cYajKHkhBVtuuALV6HSsT3oRzEPlziohjgWGiV8HFAEOd1CWTj+RAC3B/mWcmrFcexzpR1XhQgnV5LQC7GplUB9Y2E/rb8MFQHfYsRxG5GjWJ5zqe51FhwstLL/dbSklaBkRlFHyFyZNUeA74My6AHCOAWbUjZ42sVcMjaSVnM1zZsxQtSG8+UdbshaLZ9Gz5SOB0Vq4fS8J+TrUlswsSLqQ77Q+m2ouZG+jhPf7jKC59KvIYGlKHkgYVqCvhqhkIG91xg7k9M3f5KAf0yOB6yaesVxnWBCC+UQWcKRePIV9tq2eE8C+8F+rLCPJ6RXgUzpC+DvVmlQMHzmiXWLehtymb2HRX4O/2RUJxLDlVP/8=" />
</div>

<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['form1'];
if (!theForm) {
    theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>
</script>


<div class="aspNetHidden">

    <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="aQDXp34k4YJiEBt3URBFL0do/c8NXsEmuBtFz8JLRhtXerYXPFYRZmyXIpCef68aO7itJ4EUwQ9eXl2KkxDndTmS4149nNN8BX3AoFLDgB0b4w6cNsn3nzoZ3ENnU4vExyeHdXVJyyVwmZruhoQ7GA==" />
</div>
    <div>
        <div class="button">Back</div>
        <div class="button-bold">+</div>
        <h1>AAR</h1>
        <h2 id="lblQuestion">Please wait for a question...</h2>
        <ul class="clickables">


                    <li class=" arrow"
                        style="background-color: White">
                        <a id="MenuRepeater_A1_0" onclick="return true;" customid="b88d214b-0d1c-4986-821e-c1650ffbdbfd" href="javascript:__doPostBack(&#39;MenuRepeater$ctl01$A1&#39;,&#39;&#39;)"></a>
                        Question 1
                    </li>

                    <li class=" "
                        style="background-color: LightGray">
                        <a id="MenuRepeater_A1_1" onclick="return false;" customid="d566775f-4bee-4069-adb0-27e8cf8057d9" href="javascript:__doPostBack(&#39;MenuRepeater$ctl02$A1&#39;,&#39;&#39;)"></a>
                        Question 2
                    </li>


        </ul>
        <ul class="clickables">

        </ul>
    </div>
    </form>
    <script>
        $$('.clickables').each(function (clickable) {
            var list = clickable.getElements('li');

            list.addEvent('click', function () {
                var link = this.getElement('a');
                if (this.getFirst('a')) {
                    window.location = link;
                }
            });
        });
    </script>
</body>
</html>

4 个答案:

答案 0 :(得分:0)

您是否检查过parameters[0] == "False"?可能是字符串比较问题?或者可能是您的文本实际上在链接标记之外:

<a id="A1" 
    runat="server" 
    onserverclick="LinkClick"
    onclick=<%# "return javascript:LinkClick('" + ((DataRowView)Container.DataItem)["Postback"] + "')" %>
    customid='<%# ((DataRowView)Container.DataItem)["UniqueID"]%>'
    href='<%# ((DataRowView)Container.DataItem)["PageFile"]%>'>
</a>
<%# ((DataRowView)Container.DataItem)["DisplayName"]%>

应该是:

<a id="A1" 
    runat="server" 
    onserverclick="LinkClick"
    onclick=<%# "return javascript:LinkClick('" + ((DataRowView)Container.DataItem)["Postback"] + "')" %>
    customid='<%# ((DataRowView)Container.DataItem)["UniqueID"]%>'
    href='<%# ((DataRowView)Container.DataItem)["PageFile"]%>'>
    <%# ((DataRowView)Container.DataItem)["DisplayName"]%>
</a>

答案 1 :(得分:0)

你不应该onclick=<%# .... %>,因为它会自动编码输出。

应该是这样的:

<a onclick="javascript:return LinkClick('<%# ((DataRowView)Container.DataItem)["Postback"] %>')" href="something"></a>

您的输出return&#32;LinkClick(&#39;True&#39;)甚至不是javascript调用。这就是为什么你没有看到任何错误。

有关asp.net内联表达式的有用链接: http://support.microsoft.com/kb/976112

答案 2 :(得分:0)

非常感谢你的帮助。问题是.NET的XSS内容(内置,通过配置文件自动拧紧...)

一旦我删除了这条线就行了,我猜我将服务器变量放入JS的方式让我的网站认为它受到了攻击......无论如何它都将是一个私有网站,所以XSS正在被关闭。如果有人能找到更好的解决方案(更安全),那么请发帖,我会尝试一下......

<httpRuntime requestValidationMode="4.5" targetFramework="4.5" encoderType="System.Web.Security.AntiXss.AntiXssEncoder, System.Web, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a" />

^^从Web.config中移除该行(自担风险)......

答案 3 :(得分:0)

如果我理解您的问题,那么由于onclick事件中发生的某些事情而抑制onserverclick非常简单:

<span class="psw">Forgot <a href="" runat="server" onclick="return checkForRequiredEmailAddress();" onserverclick="ForgotPassword">password?</a></span>

这是我其中一页上的实际忘记密码链接。除非存在有效的电子邮件地址,否则永远不会触发onserverclick事件中指定的ForgotPassword()方法背后的代码。

“ checkForRequiredEmailAddress”方法检查其存在,结构和正确性,然后根据检查结果返回true或false。

我知道您的问题是您尝试过此操作,但是它肯定对我有用,因此我只能认为它很愚蠢。也许click事件中缺少分号会有所作为。