Question

我有一个页面，它有$（document）.ready（）方法。在该方法中，还有一个div正在加载另一个页面，该页面也有$（document）.ready（）方法，在该方法中，它向元素添加了一个click事件监听器。但它说没有元素存在。任何人都可以帮忙吗？？

div页面中的脚本：

      <script>
         $(document).ready(function() {
            console.log("Entered into the page");
            var video = document.getElementsByTagName('video')[0];
            console.log("Video id"+video);
            //P.E. style, let video@controls remain set if RS scripting not supported                
            //if(checkReadingSystemSupport()) video.removeAttribute('controls', 0);;
            video.addEventListener('click', function(e){
                    console.log("single click");
                    e.preventDefault();
                    togglePlay();
            }, false);

            video.addEventListener('dblclick', function(e){
                    console.log("Double Clicking");
                    e.preventDefault();
                    toggleControls();
            }, false);    

            video.addEventListener('keyup', function (e) {
                console.log("Key up");
                var k = e ? e.which : window.event.keyCode;
                if (k == 32) {
                    e.preventDefault();
                    togglePlay();
                }
            },false);
        });
    </script>

Answer 1

我会尝试使用jQuery，因为它已经包含在网站上了：

<script type="text/javascript">
     $(document).ready(function() {
         var video = $('video').first();
         $(document).on({
             click: function(e){
                 e.preventDefault();
                 togglePlay();
             },
             dblclick: function(e){
                e.preventDefault();
                toggleControls();
            },
            keyup: function (e) {
                if (e.which == 32) {
                    e.preventDefault();
                    togglePlay();
                }
            }
        }, video); // <-- delegated event
     });
</script>

正如问题评论中所指出的，如果javascript位于加载了ajax的页面中，浏览器并不总是执行javascript，你也必须将它包含在调用页面中，或者从ajax调用的结果中提取它并以某种方式执行它。如果您搜索SO，则已经有几个答案。

Answer 2

如果它们位于页面源内或在外部Javascript文件中链接，则只能有多个$(document.ready)个调用。

还有一个div正在加载另一个页面，该页面也有$（document）.ready（）

浏览器不执行ajax响应中包含的任何Javascript，这就是为什么没有调用$(document).ready。

jQuery为您的ajax调用提供success个事件，因此您可以添加在调用成功时要执行的任何代码。

Answer 3

我不确定我是否得到了它，但我认为你正试图达到非现有元素。如果确实如此，只需使用jquery中的live（）。尽量不要使用eventlistener - 低于8的IE不喜欢它。

编辑：或者尝试使用jquery $ getScript（）

页面可以有两个＃（document）.ready（）方法吗？

3 个答案: