I've got an empty iframe and a button:
<input type="button" name="B1" value="google"
onclick="frames['IFrameName1'].location.href='https://www.google.com/'">
But (besides .location.href) i need to set the attribute sandbox="allow-forms allow-scripts allow-same-origin
, because the framed site "deframes". How to set location AND sandbox?
If you want to do two things on one click event. Have a function do both of those things and fire that function on click.
window.onload = function(){
var button = document.getElementsByName("B1")[0]
var iframe = document.getElementsByName("IFrameName1")[0]
button.addEventListener('click',addSandboxAndChangeLocation,false);
function addSandboxAndChangeLocation(){
frames['IFrameName1'].location.href='https://www.google.com/';
iframe.sandbox = 'allow-forms allow-scripts allow-same-origin';
}
}
Check it out on jsFiddle!
While you can set the iframe.sandbox
property as a string, it's technically a DOMTokenList interface, so you can also add()
and remove()
single tokens:
let myIframe = document.createElement('iframe');
myIframe.sandbox.add('allow-scripts');
myIframe.sandbox.toggle('allow-forms');
console.log(myIframe.sandbox.toString())
// Returns: "allow-scripts allow-forms"
console.log(myIframe.outerHTML)
// Returns: <iframe sandbox="allow-scripts allow-forms"></iframe>