在Vue.js中检测跨域iframe内部的内容更改?

时间:2018-07-25 12:08:21

标签: javascript vue.js

在Vue.js(或只是普通的旧js)中,是否有可能检测到iframe(包含来自另一个域的内容)何时发生了变化?这是更精确的方案:

  1. 我加载的页面包含一个包含来自其他域的内容的iFrame
  2. 用户单击该iframe内的按钮(或执行某些操作),这将更改iframe内的内容
  3. 我能以某种方式检测到这种变化吗?

我不想影响或更改框架内的任何内容,只需检测它已更改。这可能吗?

1 个答案:

答案 0 :(得分:0)

好,我想出了一种方法来满足我的需要。我设置了一个计数器,该计数器在每个onload事件上更新(我发现有人在iframe中提交表单时会触发该计数器),然后对周围的页面进行更改:

      const iframe = document.querySelector('#myframe')
      iframe.onload = () => {
        this.formloadCounter += 1
        console.log('iframe has been loaded:' + this.formloadCounter + ' times.')
        if (this.formloadCounter>1) { 
          //do stuff 
        }
      }