Javascript 在 Spotfire Webplayer 中表现不同

Question

我实现了一些功能，用户可以使用输入字段和下拉菜单过滤数据。

因此用户可以 select 此列表中的项目（例如，最后...天或 Select 日期范围），然后在输入字段中输入 numbers/dates。然后该脚本用于显示相应的输入字段并隐藏其余部分。编辑：上周我从 7.0 更新到 Spotfire 7.5。现在这个脚本在桌面客户端上也不起作用....

这是我在网络播放器中得到的：

知道为什么会这样吗？这是我的 HTML：

Select Period:<span id="PeriodSelector"><SpotfireControl id="306fdd699c4346dbb7265c1d101fa6cf" /></span >
<span id="SelectBeginDate" style ="padding-left:1em;" > Select Begin Date:<SpotfireControl id="16b0eab3d5e3497bb2ecea3b051d2b62" /></span >
<span id="SelectEndDate" style = "padding-left:1em;">   Select End Date:<SpotfireControl id="46ac3d97e3b04af182b8b9d2462a7d27" /></span >
<span id="SelectDate"style = "padding-left:1em;">   Select Date:<SpotfireControl id="6838924384aa4567bc3bcf9da5a74c32" /></span >
<span id="LastXDays" style = "padding-left:1em;">   Number of Days:<SpotfireControl id="218b27e83771401dbbd75613acfd619b" /></span >

这是我的脚本：

$("#306fdd699c4346dbb7265c1d101fa6cf").change(function() {
    var valueText = $("#306fdd699c4346dbb7265c1d101fa6cf option:selected").text();
    if(valueText ==="Select Date"){
        $("#SelectDate").css('display','inline');
        $("#SelectBeginDate").css('display','none');
        $("#SelectEndDate").css('display','none');
        $("#LastXDays").css('display','none');
    } else if (valueText ==="Select Date Range"){
        $("#SelectDate").hide();
        $("#SelectBeginDate").css('display','inline');
        $("#SelectEndDate").css('display','inline');
        $("#LastXDays").css('display','none');
    } else if (valueText ==="Select  Last … Days"){
        $("#SelectDate").css('display','none');
        $("#SelectBeginDate").css('display','none');
        $("#SelectEndDate").css('display','none');
        $("#LastXDays").css('display','inline');
    } else {
        $("#SelectDate").css('display','none');
        $("#SelectBeginDate").css('display','none');
        $("#SelectEndDate").css('display','none');
        $("#LastXDays").css('display','none');
    }
});

网络播放器似乎没有检索下拉框的值，但我不知道为什么没有。

非常感谢任何帮助。

Answer 1

我对 javascript 的了解还不够多，无法告诉您原因，但根据我的测试并以 this link 为例，此代码可能适合您：

$("#306fdd699c4346dbb7265c1d101fa6cf").change(function() {
     $("option:selected",this).text()=="Select Date"?
      $("#SelectDate).fadeIn() & $("#SelectBeginDate").fadeOut() & $("#SelectEndDate").fadeOut() & $("#LastXDays").fadeOut():
      $("option:selected",this).text()=="Select Date Range"?
       $("#SelectDate).fadeOut() & $("#SelectBeginDate").fadeIn() & $("#SelectEndDate").fadeIn() & $("#LastXDays").fadeOut():
       $("option:selected",this).text()=="Select  Last … Days"?
        $("#SelectDate).fadeOut() & $("#SelectBeginDate").fadeOut() & $("#SelectEndDate").fadeOut() & $("#LastXDays").fadeIn():
        $("#SelectDate).fadeOut() & $("#SelectBeginDate").fadeOut() & $("#SelectEndDate").fadeOut() & $("#LastXDays").fadeOut()

})

Answer 2

所以在与 Tibco 支持联系后，似乎确实不支持 .change() 函数。

在 Spotfire 7.5 中，属性控件不再使用标准 JavaScript 输入类型实现，例如 select 标签。在 7.5 中，控件现在使用一系列 div 标签来实现，并且它们没有任何 "change" 事件可以触发。

不支持使用 JavaScript/JQuery 操作控件或添加事件，因为它们可能会发生变化。建议仅使用 JavaSript 来操作 HTML。如果需要解决方法，可以创建输入控件并使用 JS 填充它们。

也就是说，我确实找到了使用 setInterVal() 的解决方法。该代码与我原来的 post 相同 - 除了我在文本字段中使用隐藏的计算值来写入文档属性中的值。

......

setInterval(
function(){
    ...........
    var valueText= document.getElementById("Hidden").textContent;
    ...........
}, 1000);

其中 Hidden 是包含计算值的 span/div。希望这有帮助

Javascript 在 Spotfire Webplayer 中表现不同

Javascript behaves differently in Spotfire Webplayer

html

javascript

jquery

spotfire