Load () function open iframe

2

I have the code below that works perfectly.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><scriptsrc="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script type="text/javascript">
    function loadModal(){
        $('#injetada').load('teste.html');
    }
</script> 

<a onclick="loadModal()" class="btn btn-default btn-sm" data-toggle="modal" data-target="#1">Verificar</a>
 <div id="1" class="modal fade bd-example-modal-lg" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-body">
                <div id='injetada' width="900px" height="600px"></div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
            </div>
        </div>
    </div>
 </div>

However, I would like the page to open with an iframe. That is, in:

$('#injetada').load('teste.html'); 

could be

$('#injetada').load('<iframe src="teste.html" width="900" height="600"></iframe>');

I imagine I'm using the wrong syntax to call an iframe here, but I did not find any sites with the right syntax. Can you help me?

    
asked by anonymous 28.06.2018 / 21:23

1 answer

1

You can simply inject HTML with iframe into div without the need to use .load() :

function loadModal(){
   $('#injetada').html('<iframe src="teste.html" width="900" height="600"></iframe>');
}
  

Note that this width and height below syntax you are using   is invalid:

<div id='injetada' width="900px" height="600px"></div>

If you want to set the dimensions of div , you can do it in two ways:

Inline:

<div id='injetada' style="width: 900px; height: 600px;"></div>

Or in CSS:

#injetada{
   width: 900px;
   height: 600px;
}

JSFiddle Example

    
28.06.2018 / 21:50