Asp.net 回发正在触发 javascript 应该在页面加载上答案

【问题标题】：Asp.net postback is firing javascript should on be on page loadAsp.net 回发正在触发 javascript 应该在页面加载上
【发布时间】：2019-08-20 15:43:17
【问题描述】：

我发现了一些可以上传文件的 Javascript，它运行良好。但是，当我在 asp.net 页面上添加搜索时，它会触发一个清除文件的回发。这是一直触发 $(document).on("click", "#attachedfiles tr", function () 的行我试过 "load","ready" 和 .one 回发总是触发 javascript。应该使用什么来确保 javascript 仅在初始页面加载时触发？这是完整的脚本。

    $(function () {

        var fileExt = "";

        var fileDesc = "";

        fileExt = "*.jpg;*.jpeg;*.gif;";

        fileDesc = "Allowed Files ";

        fileExt += "*.mp3;*.wav";

        fileExt += "*.flv;*.mpg;*.mp4;*.avi";

        fileExt += "*.html,*.htm,*.doc;*.docx;*.pdf;*.rtf;*.txt,*.csv,*.xsl;*.xslx";

        $("[id*=FileUpload1]").uploadify({

            'swf': 'scripts/uploadify.swf',

            'buttonText': 'Attach Files',

            'uploader': 'uploadVB.ashx?key=<%=Key %>',

            'method': 'post',

            'fileSizeLimit': '12MB',

            'fileTypeDesc': fileDesc,

            'fileTypeExts': fileExt,

            'multi': true,

            'auto': true,

            'onSelect': function (event, ID) {

                $('#btnSendx0').prop('disabled', true);

                $("#attachedfiles tr").each(function () {

                    if ($("td", this).eq(0).html() == event.name) {

                        alert(event.name + " already uploaded.");

                        $('#btnSendx0').prop('disabled', false);

                        $("#FileUpload1").uploadify('cancel');

                        return;

                    }

                });

            },

            'onUploadComplete': function (event, ID, file, response, data) {

                $('#btnSendx0').prop('disabled', false);

                $("#attachedfiles").append("<tr class='someclass'><td>" + event.name + "</td><td><a href='javascript:;' >[x]</a></td></tr>");

            }

        });

    });



    $(document).on("click", "#attachedfiles tr", function () {

        console.log($(this).attr('someclass'));

        var row = $(this).closest("tr");

        var fileName = $(this).closest('tr').find('td').eq(0).html();

        var href = $(this).find("a").attr("href");

        $.ajax({

            type: "POST",

            url: "sendEmails.aspx/RemoveFile",

            data: '{fileName: "' + fileName + '", key: "<%=Key %>" }',

                    contentType: "application/json; charset=utf-8",

                    dataType: "json",

                    success: function () { },

                    failure: function (response) {

                        alert(response.d);

                    }

                });

                row.remove();

            });

【问题讨论】：

标签： javascript jquery asp.net

【解决方案1】：

我认为您错过了一点：每次回发时，都会再次加载 HTML 页面。 HTML 是无状态的，但是通过使用 POST 和 ViewState，ASP.NET 模拟了一个有状态的 HTML。这可能很混乱：您认为页面没有完全加载，但实际上是这样，并且每次请求由 runat="server" 元素（updatepanel 和其他 ajax 友好控件除外）完成时重新填充数据与您在请求之前拥有的数据相同。

所以关键是 HTML（当浏览器解释 HTML 时执行 javascript），不能“直接”知道它是第一次加载还是第 x 次加载（理论上可以通过引荐来源获得，但正在开发这个问题的正确逻辑......这与 PostBack 或其他 ASP.NET 机制无关）。

要回答您的问题，请尝试仅在不是回发时呈现脚本，在页面中创建受保护的字符串 loadInitialScript() 方法，如果不是回发，则将脚本作为字符串返回，否则为 string.Empty。然后在你的脚本标签中：

<script type="text/javascript>
    <%=loadInitialScript()%>
</script>

所以如果是回发，loadInitialScript 方法会返回一个空字符串，否则会返回 javascript 函数（我建议使用 $(document).on("ready")）并执行。

【讨论】：