0

I have a simple JS script to swap out elements containing Flash and replace them with other formats for users who don't have Flash installed.

var hideclass="hidden"
var showclass="empty"


function flashFixMain(){    
if (swfobject.hasFlashPlayerVersion("7.0.0")) {

    document.getElementById('logoflash').className=showclass;
    document.getElementById('logononflash').className=hideclass;

} else {

    document.getElementById('logoflash').className=hideclass;
    document.getElementById('logononflash').className=showclass;

    }
}

And put simply, it doesn't work.

  • The if statement works fine - putting an alert in the appropriate place pops up fine.
  • I've checked the source of the appropriate page(s) online, and the element name pops up exactly as written (and only once!).
  • The class names work fine, as they are used as defaults on the page at the start.

So does anyone have any ideas what I might have missed?

4

4 回答 4

8

改变

document.getElementById('logoflash').class=showclass;

document.getElementById('logoflash').className = showclass;

className,不是class

于 2013-07-22T15:58:04.197 回答
5

而不是使用.class你需要使用.className属性;例如:

document.getElementById('logoflash').className = showclass;

在现代浏览器中,您还可以使用.classList添加类而不是替换所有现有类:

document.getElementById('logoflash').classList.add(showclass);

顺便说一句,您可以考虑像这样移动一些语句:

var hasFlash = swfobject.hasFlashPlayerVersion("7.0.0"),
logoFlash = document.getElementById('logoflash'),
logoNonFlash = document.getElementById('logononflash');

logoFlash.className = hasFlash ? showclass : hideclass;
logoNonFlash.className = hasFlash ? hideclass : showclass;
于 2013-07-22T15:58:22.093 回答
0

我写了一个快速测试场景,没有看到更多你的环境,看不到任何可以阻止它按预期工作的东西。

我在使用 jQuery 编写 w/o 时注意到的一件事(我猜你没有使用它?)是你的 'addClass' 实际上是一个 'REPLACE' 类值。您只是将其设置为单个类。

这让我觉得,没有看到你的环境,一些 OTHER 类可能已经分配给你正在被消灭的元素。如果您的某些显示依赖于这些其他类,这可能会导致意外行为......

如果没有看到更多您的场景,那似乎是唯一可能成为问题的事情。

无论如何,这是我的测试设置。您可能会在其中找到一些有用的东西。

<div id="logoflash" class='something'>
    Logoflash
</div>

<div id="logononflash" class='else' >
    logononflash
</div>



<script>

var swfobject = {FlashPlayerVersion: '7.0.1', hasFlashPlayerVersion: function(v) {if(v == this.FlashPlayerVersion) return true; else return false;}, myName: 'fakeSWObject' };
console.log(swfobject)

var hideclass = "hidden"
var showclass = "empty"
var getById = function(sID) { return document.getElementById(sID); };
var addClass = function(sID, sClass) { getById(sID).className += ' ' + sClass  };

function toggleEl(sID, bState){
    console.log('begin toggleEl')
    console.log('bState: ' + bState)
    try {
        if(bState == undefined) {
            console.log('Toggling by element state');
            getById(sID).style.display = getById(sID).style.display == 'none' ? 'block' : 'none';
        } else {
            console.log('Toggling by argument');
            getById(sID).style.display = !!bState ? 'block' : 'none';
        }

    } catch (err) {
        console.log(err);
    }
}

function flashFixMain(){

  if (swfobject.hasFlashPlayerVersion("7.0.0")) {
    console.log('Is Flash 7.0.0');
    toggleEl('logoflash', true);
    toggleEl('logononflash', false);
    addClass('logoflash', hideclass);
    addClass('logononflash', showclass);

} else {
    console.log('Is NOT Flash 7.0.0');
    toggleEl('logoflash', true)
    toggleEl('logononflash', false)
    addClass('logoflash', showclass);
    addClass('logononflash', hideclass);
    }
}


$(function(){ // Yes, this is jQuery to fire after doc is ready
    flashFixMain();
})

</script>
于 2013-07-22T16:56:11.957 回答
-1

使用jQuery:

$("#logoflash").addClass(hideclass);

或者

$('#logoflash').toggleClass(hideclass, swfobject.hasFlashPlayerVersion("7.0.0"));
于 2013-07-22T16:04:20.600 回答