Skip to content Skip to sidebar Skip to footer
Home / Html / Javascript

Onlick Event Not Working Within A Window.open

Post a Comment
I'm trying to achieve an onclick event once window.open has opened. So that when the user clicks a button in the new window it works. The onclick event works if it's not within the

Solution 1:

In the end I managed to get the onclick even to work within the window.open.

I also was intergrating a function to increase and decrease the font-size within the window.open onclick.

// Creating window to open for text that are in div with class name show-dialog
$(".Show a").click(function() {
    // Varible grabs content of show dialogs
    var activityContent =  $(this).parent().next("div.show-dialog").html();
    // Establish varibale to create buttons to increase text
    var userGUI = "<div class='userGUI'><a href='javascript:void(0);' onclick='resizeText(1)' id='plustext'><i class='fa fa-plus-square-o fa-2x'></i></a>
    <a href='javascript:void(0);' onclick='resizeText(-1)' id='minustext'><i class='fa fa-minus-square-o fa-2x'></i></a><br>Increase / Decrease font size.</div>";
    // Created variable for the window.open
    var inWindow = window.open("", "mywindow1", "width=950,height=550,scrollbars=yes,toolbar=yes,menubar=yes");

    // Writing to the inWindow variable
    inWindow.document.write("<html><head>");
    inWindow.document.write("<link rel='stylesheet' href='https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css'><link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>");
    inWindow.document.write("<title>Hello world</title>");
    inWindow.document.write("<style>body{font-family: 'Open Sans', sans-serif; font-size: 18px; line-height: 1.8;}a{color:#663366;}a:hover{color:#844484;}.userGUI{float:right;}</style>");
    inWindow.document.write("</head><body id='content'>");

    $(inWindow.document).find("body").append(userGUI);
    $(inWindow.document).find("body").append("<br><br>");
    $(inWindow.document).find("body").append(activityContent);

    inWindow.document.write("</body><script type='text/javascript'>
    // Increase font size function
    function resizeText(multiplier) {
      var c = document.getElementById('content');
      if (c.style.fontSize == '')
      { c.style.fontSize = '1.175em'; } c.style.fontSize = parseFloat(c.style.fontSize) + (multiplier * 0.2) + 'em';
    }</script></html>");
    inWindow.document.write("");
    inWindow.document.close();
});

The html to this is in my question above ^.


Post a Comment for "Onlick Event Not Working Within A Window.open"