Question

我的页面中有一个Ajax Loaded Div，在该div中，一个Jquery插件加载了我的Google Spreadsheet。我需要添加一些＆＃34;事件监听＆＃34;检测加载电子表格的时间，但是加载的时间不可预测存在问题，并且据我所知，事件INSIDE我的div（带外部html内容）无法收听＆＃34;父＆＃34;窗口。顺便说一句，我已经尝试了很多方法来做到这一点。

我会发布我的代码，但我认为它无法提供帮助。我能说的是：加载内容时我的div的高度会发生变化。在这种情况下，回调功能无法正常工作，因为我的脚本（内部div）只在加载页面后才能获得电子表格。

的index.html

$.ajax({
    url : "test/index.html",
    type : "get",
    async: true,
    success : function(result) {
    $('.mailcontrol').html(result);
    },
    error: function() {
       alert("Error");
    }
 });

测试/ index.html中

<script type="text/javascript">
$('#dat').sheetrock({
  url: 'https://docs.google.com/spreadsheets/ssid'}); 
</script>

关于某些事件在我的案件中倾听的任何想法？谢谢！

编辑：

jrummell回答给了我一个想法，在同一页面内使用插件忽略外部html文件，因此，我可以使用＆＃34; sheetrock＆＃34;的回调函数，如Andre所建议的那样。

感谢您的回答!!

新代码：

$("#target2").click(function () {
var script = document.createElement( 'script' );
script.type = 'text/javascript';
script.src = 'sheetrock.min.js';
$("#dat").append(script);
$('#dat').sheetrock({
  url: 'https://docs.google.com/spreadsheets',
    callback: function() {
  } 
  }); 
});

Answer 1

你可以使用Jquery on（）事件监听，如下所示：

$('.mailcontrol').on('eventName', '#dat', callbackFunction);

“selector”参数是一个选择器字符串，用于过滤触发事件的所选元素的后代。在你的情况下“#dat”。我建议使用“resize”作为eventName。

参考：http://api.jquery.com/on/

Answer 2

尝试在加载内容后初始化电子表格插件：

$.ajax({
    url : "test/index.html",
    type : "get",
    async: true,
    success : function(result) {
        $('.mailcontrol').html(result);
        $('#dat').sheetrock({
            url: 'https://docs.google.com/spreadsheets/ssid'}); 
    },
    error: function() {
       alert("Error");
    }
 });

Answer 3

您是否尝试过原始的sheetrock回调？

$('#dat').sheetrock({
  url: 'https://docs.google.com/spreadsheets/ssid',
  callback: function() {
      //trigger event to be caught 
  }  
});

参考：https://github.com/chriszarate/sheetrock#callback

在Ajax加载的外部html中调用脚本之后的事件

3 个答案: