調用iFrame按鈕，然後父按鈕

Question

我在iFrame中有一個按鈕，在父窗口中有一個按鈕。從父窗口觸發iFrame內的按鈕。我有一些要從兩個按鈕執行的代碼集。部分代碼特定於iFrame，部分代碼特定於父窗口。我能夠觸發iFrame按鈕，但問題是父窗口代碼在iFrame按鈕完成其操作之前運行。

請幫我實現這一點。

請提前建議並提前致謝。

Answer 1

在外部文件中，設置按鈕2創建包含要BUTTON1完成後執行的操作鏈中的一個新的事件，並派遣它到內部按鈕。

根據您要執行的操作，您可能必須在此點擊處理程序中聲明任何變量，延期操作將需要這些變量，以使它們成爲閉包的一部分。

$(function(){ 
    $("#button2").click(function(e){ 
     var action = function() { 
      setTimeout(function(){alert("button2 action")},6000); 
     } 
     var innerButton = $("iframe#frame").contents() 
      .find("#button1"); 
     e.detail = action; 
     var evt = new CustomEvent('click',e); 
     innerButton[0].dispatchEvent(evt); 
    }); 
}); 

在內部文件中，單擊按鈕進行正常的動作後，請檢查是否採取額外的行動與事件經過，並執行它們。

$(function() { 
    $("#button1").click(function (evt) { 
     setTimeout(function() { 
      alert("button1 click"); 
      if (typeof evt.originalEvent.detail == 'function') evt.originalEvent.detail(evt); 
     }, 3000); 
    }); 
}); 

這裏是一對jsFiddles的，一個用於inner，和另一個用於outer，其包括在一個（未很legibile）IFRAME內。

Answer 2

你可以做到這樣，

$("#btnButton2").hide(); 
$("#btnButton2").click(function() { 
    setTimeout(function() { 
     console.log("Hello from Button 2"); 
    }, 3000); 
}); 

$("#btnButton1").click(function() { 
    setTimeout(function() { 
     console.log("Hello from Button 1"); 
     $("#btnButton2").show().click(); 
    }, 6000); 
}); 

Fiddle