自定义JS函数未定义问题

Question

我在search.js文件中有一个称为ShwoDialog() js函数。 当我运行我的应用程序时，我收到了Firefox的错误消息ReferenceError: ShwoDialog is not defined

我虽然可能是在加载定义了功能的名为search.js的js文件之前调用了函数ShwoDialog() 。 所以我看到了html源，发现在search.js文件加载后ShwoDialog()正在调用。

这是我的资料的一小部分

<script type="text/javascript" src="/Scripts/BlockUI.js"></script>
<script type="text/javascript" src="/Scripts/jquery.ba-bbq.min.js"></script>
<script type="text/javascript" src="/Scripts/jquery.tmpl.js"></script>
<script type="text/javascript" src="/Scripts/Search.js"></script>

<script language='javascript'> 
$(document).ready(function () { ShwoDialog(); });
</script>
</form>

我想我的ShwoDialog（）函数调用时可能是上述所有js正在加载。 有什么方法可以确保仅在完成search.js文件的加载后才调用函数。 有什么技巧是可能的，请与我讨论。 谢谢

更新

我尝试用这种方式做事，但还是没有运气

<script type='text/javascript'>
function fireWhenReady() {
    if (typeof function1 != 'undefined') {
        function1();
    }
    else {
        setTimeout(fireWhenReady, 100);
    }
}
$(document).ready(fireWhenReady);
</script>

我的ShowDialog完整代码

function ShowDialog() {
        $("#SrchDialog")
        .html('<div class="Srchloading"></div>')
            .dialog({
                autoOpen: false,
                bgiframe: true,
                height: 542,
                width: 314,
                modal: false,
                draggable: true,
                resizable: false,
                closeOnEscape: false,
                show: {
                    effect: "fade",
                    duration: 600
                },
                hide: {
                    effect: "fade",
                    duration: 500
                },
                open: function (type, data) {
                    //$(this).dialog('destroy').remove();
                    $(this).parent().appendTo('.g8');

                    var t = $(this).parent(), w = window;
                    t.offset({
                        top: (($(window).height() - 542) / 2),
                        left: (($(window).width() - 314) / 2)
                    });
                },
                close: function () {
                    //$(this).dialog('destroy').remove();
                }
            });


        $("#SrchDialog").load('SearchFeedback.aspx', function (responseTxt, statusTxt, xhr) {
            if (statusTxt == "success") {
                sHtml = responseTxt;
                sHtml = $(sHtml).find('#SrchExtract').html();
                $sHtml = $(sHtml);
                $("#SrchDialog").html(sHtml);
                $("#SrchDialog").dialog('open').show();
                BindEvent();
            }

            if (statusTxt == "error") {
                alert("Error: " + xhr.status + ": " + xhr.statusText);
            }
        });

    }

    function BindEvent() {
        $("input[id*='btnsrchSubmit']").live("click", function () {
            alert('send');
            return false;
        });

        $("#imgSrchclose").live("click", function () {
            $("#SrchDialog").closest('.ui-dialog-content').dialog('close');
            return false;
        });
    }

在search.js文件中定义的给定ShowDialog代码。 当我在按钮上单击ShowDialog函数时，它可以正常工作，但是当我在页面底部调用时，我得到了一个错误，称为函数未定义。 请告诉我ShowDialog函数出了什么问题以及如何解决。

Answer 1

<script type="text/javascript" src="/Scripts/BlockUI.js"></script>
<script type="text/javascript" src="/Scripts/jquery.ba-bbq.min.js"></script>
<script type="text/javascript" src="/Scripts/jquery.tmpl.js"></script>
<script type="text/javascript" src="/Scripts/Search.js"></script>

<script language='javascript'> 
$(document).ready(function () { ShwoDialog(); });
</script>

Javascript将以串行顺序处理，因此如果您的函数未使用DOM ，它甚至也可以在没有docuemnt.ready情况下工作。

首先， blockui.js将被加载，运行。 然后加载并运行jquery ，因此它以串行顺序进行，一切都很好。

1. 如果代码中的任何地方发生某些错误，则可能会被中断，然后将不进行任何处理。 检查您的控制台是否有错误。

2. 同样，如果search.js无法加载，则该函数将保持未定义状态。 检查并确保已加载searchjs ，请在chrome开发工具中使用“网络”标签，或在firefox / ie中使用对应的标签。

3. 正如@joe所提到的，它甚至可能是范围问题。

4. 在使用所有这些jquery插件之前，您是否包括了jquery ？

Answer 2

首先尝试查看是否确实加载了每个javascript，然后删除对该函数的调用，并检查控制台中是否还有其他错误。 同样，当您按此顺序调用javascript时，也无需使用准备就绪的文档。