在进程成功消息中使用 javascript答案

【问题标题】：using javascript in process success message在进程成功消息中使用 javascript
【发布时间】：2012-08-09 15:31:39
【问题描述】：

我正在使用 Apex 4.0.2。我的目标是在我成功填写表格后让我的成功消息在顶部闪烁。我有一个javascript函数：

 <script type="text/javascript">
 {var i = 1,timer;
window.onload=function() {
 timer = setInterval('flash()', 500);
 }
 function flash() {
  if (i<10000) {
         if (i%2 == 0) { 
          document.getElementById('flash').style.backgroundColor = '#ffffff';
     } else {
          document.getElementById('flash').style.backgroundColor = '#ffff00';
     }
  } else {
       document.getElementById('flash').style.backgroundColor = '#ffffff';
       clearInterval(timer);
   }
  i++;
 }
 </script>

我最初将此代码放置在表单分支到的页面的 javascript 选项卡上。后来我把它和函数调用一起移到了进程成功消息中

<center>
<table id="flash"  BORDER=0 >
<tr>
<td>Success!</td>
</tr>   
</table>
</center>

我收到来自 Firebug 页面的错误：

document.getElementById("flash") is null
document.getElementById('flash').style.backgroundColor = '#ffff00';

Internet Explorer 告诉我：消息：需要对象

我认为我的问题是成功消息区域对象并不总是存在。只有当我调用显示成功消息时，有什么方法可以执行该函数？

提前，非常感谢您的帮助！

【问题讨论】：

标签： oracle-apex

【解决方案1】：

javascript 区域有其用途，但我建议使用动态操作，因为它们可以更清晰地概述页面上发生的情况。

编辑您的页面标题（页面，编辑），或添加到您的 css：

<style>
.flash1{
background-color: blue;
}
.flash2{
background-color: yellow;
}
</style>

创建新的动态操作：
事件：页面加载，条件：无
作为真正的操作，选择“执行 Javascript 代码”作为操作。
使用 jQuery 获取对象并在类之间切换。它更干净因为你没有在 javascript 中混入 css/style。

var $smsg = $(".uMessageText"), flash;
$smsg.addClass('flash1');
if($smsg.length){
   flash = setInterval(function(){
      $smsg.toggleClass('flash1');
      $smsg.toggleClass('flash2');
      }, 1000);
   setTimeout(function(){
      clearInterval(flash);
      }, 10001);   
};

这将每秒更改成功消息上的类，持续 10 秒。间隔在这 10 秒后被清除。不如果未找到成功消息，将启动间隔因为 jQuery 对象将为空（长度=0）。

var $smsg = $(".uMessageText")

这是您的成功消息元素的选择器，并且这个 example 是 Theme 23 中该元素的选择器。请注意成功消息 ID 或类别取决于您选择的主题和页面模板，您很可能需要更改它。的当然，选择器可以是你喜欢的任何元素。

如果你不熟悉 jQuery，我建议你看看它。它默认包含在 apex 中（并且 apex 依赖于它），并且在 javascripting 时是一个非常强大的工具。 http://jquery.com/

简而言之：按 id 选择元素：$("#id_attribute_here")，按类选择 $(".class_name_here")

【讨论】：