为什么我从html doc获得函数未定义错误?

时间:2018-04-23 17:14:19

标签: javascript jquery html ajax django

我写了一个小聊天应用程序。 首先,所有代码都包含在一个HTML文档中,并且工作正常。 将CSS,HTML和JS分隔成单独的文件。 从HTML文档中调用的函数register_popup现在已经生成;

"ReferenceError: register_popup is not defined"

我可以看到脚本正在加载,从开发人员工具中我看到没有问题,所有200和302都是。

HTML

<div class="sidebar-name">
            <a href="#" onclick="register_popup('user4', 

'USER4');">

                <img width="30" height="30" src="" />
                <span>user4</span>
            </a>
加载脚本可以看到

脚本 我在用,

<script>
var url = "static/js/chatpop.js";
$.getScript(url);
</script>

让alos尝试更改HTML:

<div class="sidebar-name">
            <a href="javascript:register_popup('user3', 'USER3');">
                <img width="30" height="30" src="" />
                <span>user3</span>
            </a>
        </div>

但这也不起作用。如上所述,我在加载脚本时得到200,当包含在同一页面时,一切正常。只有在将代码分成相应的文件后才会发生错误,

以下也可以加载确定。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3      /jquery.min.js"></script>
    <!-- Latest compiled JavaScript -->
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>

欢迎任何帮助......

功能

function register_popup(id, name)
            {

                for(var iii = 0; iii < popups.length; iii++)
                {  
                    //already registered. Bring it to front.
                    if(id == popups[iii])
                    {
                        Array.remove(popups, iii);

                        popups.unshift(id);

                        calculate_popups();


                        return;
                    }
                }              

                var element = '<div class="popup-box chat-popup" id="'+ id +'">';
                element = element + '<div class="popup-head">';
                element = element + '<div class="popup-head-left">'+ name +'</div>';
                element = element + '<div class="popup-head-right"><a href="javascript:close_popup(\''+ id +'\');">&#10005;</a></div>';
                element = element + '<div style="clear: both"></div></\
                div><div class="popup-messages">\
                <form action="chatpop/post" id="chat-form" method="post">\
                <textarea style="resize:none;"cols="41" rows="14" >\
                </textarea><input type="submit" id="chat-form" value="Send">\
                </input></form></div></div>';

                document.getElementsByTagName("body")[0].innerHTML = document.getElementsByTagName("body")[0].innerHTML + element; 

                popups.unshift(id);

                calculate_popups();

            }

1 个答案:

答案 0 :(得分:0)

下面

<script>
  var url = "static/js/chatpop.js";
  $.getScript(url);
</script>

您尝试以异步方式导入脚本并立即在html中调用脚本中定义的一些函数(在实际加载脚本之前)。

您应该以阻止的方式在标题中引用您的脚本,如:

<script src="static/js/chatpop.js" />
提取脚本后

或更改锚标记:

...
<a id="myAnchor">
...

$.getScript(url).done(function(){
        $("#myAnchor").attr("href", register_popup('user3', 'USER3'))
    });
}