Question

以下是fiddle example 我喜欢做的事情。我想鼠标悬停在iframe（同一个域）内的元素，然后更改字体的颜色。就像在例子中一样。

但是在我的版本中，首先在按下按钮后创建iframe - my fiddle example。在我的例子中鼠标悬停不会工作，我不知道为什么。我不是那种经验丰富的javascript而且无法自己搞清楚。也许我想做的事情无法完成，或者我只是遗漏了一些东西。

function load_iframe(callback) {
    $('#iframe').append('<iframe class="ajax" scrolling="no" style="height:190px" src="http://fiddle.jshell.net/38g2pyxh/"></iframe>')
    $('.ajax').load(function() {
        callback(this);
    });
}

$(document).on('click','#create',function(callback){
    load_iframe(function(){
    iframe = $('iframe.ajax').contents()
    iframe.find('body').prepend('<b>This is a test</b><br><b>Click here</b>');
    })
    return iframe
})

iframe.on('mouseover', 'b', function() {
    $(this).css('color','red');
});

到目前为止我做了什么 Fiddle

Answer 1

这是一个简单的代码，我希望能帮到你....我正在编辑你的代码

var iframe
var a
function load_iframe(callback) {

        $('#iframe').append('<iframe id="1a" class="ajax" scrolling="no" style="height:190px" src="http://fiddle.jshell.net/38g2pyxh/"></iframe>')
        $('.ajax').load(function() {
            callback(this);
        });
    }

    $(document).on('click','#create',function(callback){

                load_iframe(function(){
                    iframe = $('iframe.ajax').contents()
                    iframe.find('body').prepend('<b id="bb">This is a test</b><br><b>Click here</b>');
                      a=document.getElementById('1a').contentWindow.document.getElementById('bb')
    alert('pass')
     a.onmouseover=function(){
     a.style.color="red"
    }
       a.onmouseleave=function(){
     a.style.color="black"
    }
                })

            return iframe
    })

Jquery mouseover附加iframe（相同域）元素

1 个答案: