当容器被隐藏时，防止java小程序被破坏

Prevent java applet from being destroyed when container is hidden

本文关键字：java 程序 防止 隐藏      更新时间：2023-09-26

我有一堆ifdiv，每个div都包含一些文本、一个java小程序（是的…）和一些按钮；现在我正在实现一个搜索函数，它可以动态地显示和隐藏这些DIV，但每当我将display:none设置为DIV时，其中的applet就会立即被销毁，就像它是从html代码中删除的一样，然后在再次显示DIV时重新创建。有办法防止这种情况发生吗？

有办法防止这种情况发生吗？

不要调用div元素上的display: none。请尝试visibility:hidden;，或者应用将小程序从可见页面上移开的样式。像这样的东西1：

<html>
<head>
<title>Removing elements from view</title>
<style type='text/css'>
.plain {
}
.removed {
    position: absolute;
    left: -1200px;
    top: -1200px;
}
</style>
<script type='text/javascript'>
function show() {
    document.getElementById('target').className='plain';
}
function hide() {
    document.getElementById('target').className='removed';
}
var count=0;
function increment() {
    count++;
    document.getElementById('output').value=count;
}
window.setInterval(function(){increment()}, 1000);
</script>
</head>
<body>
<h1>Move the element off page</h1>
<input type='button' value='Hide' onclick='hide();'>
<div id='target' style='background-color:#F00;'>
<input id='output' type='text' size='4'>
</div>
<input type='button' value='Show' onclick='show();'>
</body>
</html>
  1. 在FF中测试，但未验证

也许不幸的是，您所描述的行为正是当今浏览器的行为。

你仍然可以隐藏小程序，但不能通过隐藏它的父分区来实现

首先，您必须将web UI元素放在与小程序的div分开的div中。您可以根据自己的描述隐藏web UI元素（设置"display:none"）。但是要隐藏Java小程序，您可以在小程序元素上设置样式"width:0px；height:0px"。

设置小程序样式的宽度和高度很重要，而不是设置小程序的宽度和高度属性。

一个隐藏的小程序元素如下所示：

<applet id="myHidableApplet"
        width="600px" height="400px"
        style="width: 0px; height: 0px;">

注意
 nbsp；-小程序的样式指定"width: 0px height: 0px"，而
 nbsp；-小程序的属性指定CCD_ 5。

一个可见的组可能看起来像这样：

<div id="group1">
    <applet id="group1applet"
            width="600px" height="400px"
            style="width: 600px; height: 400px;">    <!-- visible -->
        <param> etc... </param>
    </applet>
    <div id="group1ui" style="display: block">       <!-- visible -->
        <input name="Name" type="text" />
    </div>
</div>

当你隐藏群组时，你必须将其转换为这样的东西：

<div id="group1">
    <applet id="group1applet"
            width="600px" height="400px"
            style="width: 0px; height: 0px;">    <!-- hidden -->
        <param> etc... </param>
    </applet>
    <div id="group1ui" style="display: none">    <!-- hidden -->
        <input name="Name" type="text" />
    </div>
</div>

在试图找到一种部署完全隐藏的小程序的方法时，我发现了width和height元素属性与width和high样式属性

需要牢记的事项：

  • <div>包含小程序的内容必须可见。。。否则小程序将不会加载
  • <小程序width="0px"height="0px">将不会在Chrome中加载小程序
  • 在小程序的<div>导致小程序卸载（如您所发现的）
  • 在<小程序>导致小程序在Chrome中卸载
  • 设置.style.width和.style.height与设置.wide和.height不同
  • 设置.style.width=0和.style.height=0使<小程序>看不见

根据您的网站布局，您可以使用一些简单的css将iframe放置在小程序的顶部，并将颜色设置为任何背景。http://jsfiddle.net/tQL93/3/

<iframe id="iframe_shim" class="iframe_shim" frameBorder="0">
</iframe>
<div class='applet'>
</div>
<button id='hideBtn' type="button" title="Hide Applet" style="width:100px;" 
onclick="hideApplet();">Hide</button>

function hideApplet(){
    var el = document.getElementById('hideBtn');
    if (el.innerHTML == 'Hide'){
        el.innerHTML = 'Show'
        document.getElementById('iframe_shim').style.display = 'block'
    } else {
        el.innerHTML = 'Hide'        
        document.getElementById('iframe_shim').style.display = 'none'
    } 
}
相关文章：