yujiokayama
2/7/2018 - 5:49 AM

jQueryで親フレームと子フレーム間で関数の実行や要素の参照・設定

■子フレーム内の要素の操作・参照。

$('要素').contents().find().~


$(function(){
  $('#testbt1').click(function () {
    $('#childframe').contents().find('#childtest').val("Hello!");
  });
});


■子フレーム内の関数を実行する。
parent.子フレームID.$.関数名

・親
$(function(){
  $('#testbt2').click(function () {
  var i=1;
  parent.childframe.$.childFunc(i);
  });
});

・子
(function($) {
  $.childFunc = function(i) {
    alert(i);
  };
})(jQuery);

■親フレーム内の要素の操作・参照。
$("要素",parent.document).~

$(function(){
  $('#testbt1').click(function () {
    $("#parenttest",parent.document).val("Hello!");
  });
});

■親フレーム内の関数を実行する。
・親
$(function(){
  $('#testbt2').click(function () {
    var i=1;
    parent.$.parentFunc(i);
  });
});

・子
(function($) {
  $.parentFunc = function(i) {
    alert(i);
  };
})(jQuery);