如何修复“element.dispatchEvent不是一个函数”而不破坏别的东西?

时间:2014-11-22 17:48:16

标签: javascript jquery events dispatchevent

我遇到与"element.dispatchEvent is not a function" js error caught in firebug of FF3.0相同的问题,但是在谷歌浏览器中。

我写过<script>jQuery.noConflict();</script> 在所有脚本之后。但现在我有另一个问题:

  ...
  $("a.try").click(function () {
  ...

undefined不是函数

 ...
 var blockHeight = $(window).height();
 ...

undefined不是函数

因此,首次修复无效。

P.S。

html部分,其中包含脚本:

....
<script type="text/javascript"
        src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<script type="text/javascript"
        src="<c:url value='/resources/js/underscore.js'/>"></script>
<script type="text/javascript"
        src="<c:url value='/resources/js/jquery-1.8.2.min.js'/>"></script>

<script type="text/javascript"
        src="<c:url value='/resources/js/jquery.mousewheel.js'/>"></script>
<script type="text/javascript"
        src="<c:url value='/resources/js/popup.js'/>"></script>
<script type="text/javascript"
        src="<c:url value='/resources/js/jquery.jscrollpane.min.js'/>"></script>

<script type="text/javascript"
        src="<c:url value='/resources/js/scroll-startstop.events.jquery.js'/>"></script>

<script type="text/javascript"
        src="<c:url value='/resources/js/jquery-ui-1.10.0.custom.min.js'/>"></script>

<script type="text/javascript"
        src="<c:url value='/resources/js/script-ini.js'/>"></script>
<script type="text/javascript"
        src="<c:url value='/resources/js/map/map.js'/>"></script>
<script type="text/javascript"
        src="//maps.google.com/maps/api/js?sensor=true&js?v=3.exp&libraries=places"></script>

<script type="text/template" id="terminal-template">
    ...
</script>
<style>
    .grey-terminal {
        background-color: rgb(226, 226, 226);
    }
</style>
<script type="text/javascript"
        src="<c:url value='/resources/js/addTerminal.js'/>"></script>
<script>jQuery.noConflict();</script>
...

你能以另一种方式提出建议吗?

2 个答案:

答案 0 :(得分:2)

当您致电jQuery.noConflict();时,您不再将jQuery$变量相关联。

$().click$(selector)之类的内容会引发错误。相反,你可以做这样的事情:

jQuery.noConflict();
jQuery('a.try').click(handler);
jQuery(window).height();

或者,您也可以将jQuery分配给一个新变量,如下所示:

var j$ = jQuery.noConflict();
j$('a.try').click(handler);
j$(window).height();

http://jsfiddle.net/wL4mc03a/

修改

对于调度事件,您可以使用jQuery的一种方法是trigger事件。假设你有一些看起来像这样的代码:

jQuery(document).on('keydown', function(e){
    if (e.which === 42) {
        alert('That is the key to life!');
    }
});

稍后,您可以触发此事件。我们不是使用字符串触发事件(&#39; keydown&#39;),而是创建一个jQuery事件并传递它。

var evt = jQuery.Event('keydown');
evt.which = 42;

jQuery(document).trigger(evt);

答案 1 :(得分:1)

这对我有帮助! 添加 jQuery.noConflict();就在开始 jquery 代码之前,然后将所有 '$' 替换为 'jQuery'。

<script type="text/javascript">
  
    jQuery.noConflict();
    jQuery(document).ready(function() {
        ....
        ....
    });
</script>

与上述解决方案@Jack 中提到的相同