我不够熟练，无法弄清楚这在 IE9 中是哪一部分出错了。我有一个显示单词的游戏，当他们点击一个 div 时，它会动画一个翻转动作并显示与该单词相关的描述。
在 IE9 中，它会加载第一个单词，但不会动画并显示描述。这是我在 jquery/javascript 中创建的第一件事。这是几个不同的 jquery 库和一些 javascript 的科学怪人怪物。
- 翻转动作： http: //lab.smashup.it/flip/（这适用于 IE9 ..）
- xml2json@fyneworks.com
为了使它起作用，我必须研究什么？
这是代码：
<script src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
// Load jQuery
google.load("jquery", "1");
</script>
<script src="js/jquery-ui-1.7.2.custom.min.js"></script>
<script src="js/jquery.flip.min.js"></script>
<script src="js/jquery.xml2json.js" type="text/javascript" language="javascript"></script>
<script type="text/javascript">
var cC = 0;
var flashcards;
var aCards = [];
var totalCards = Number(0);
var cardToggle = Boolean(false); //not Flipped to start out
$.get('xml/den204_fc_module01.xml', function(xml) {
var flash = $.xml2json(xml);
flashcards = flash.card;
for (var i = 0, len = flashcards.length; i < len; i++) {
var tempCards = flashcards[i];
aCards.push({
t: tempCards.term,
d: tempCards.def
});
function shuffle(array) { // from: http://stackoverflow.com/questions/6274339/how-can-i-shuffle-an-array-in-javascript
var counter = array.length, temp, index;
while (counter > 0) {
index = (Math.random() * counter--) | 0;
temp = array[counter];
array[counter] = array[index];
array[index] = temp;
}
return array;
}
shuffle(aCards);
totalCards = aCards.length;
$('#containerFront').text(aCards[cC].t);
$("#previousSet").addClass("disabled");
}
});
$(document).ready(function() {
$("#clickableCard").click(function() {
if (cardToggle === false) {
console.log('cardToggle is equal to false');
cardToggle = true;
$("#flipbox").flip({
direction: "tb",
color: "#ffd699",
content: "<div id='containerBack'>" + aCards[cC].d + "</div>",
speed: 400,
});
} else {
console.log('cardToggle is equal to true');
cardToggle = false;
$("#flipbox").flip({
direction: "bt",
color: "#adc2d6",
content: "<div id='containerFront'>" + aCards[cC].t + "</div>",
speed: 400,
});
}
return false;
});
$("#navi").click(function() {
if (cardToggle === true) {
console.log('cardToggle is equal to true');
cardToggle = false;
$("#flipbox").flip({
direction: "bt",
color: "#adc2d6",
content: "<div id='containerFront'>" + aCards[cC].t + "</div>",
speed: 200,
});
}
if (cC === 0) {
$("#previousSet").addClass("disabled");
} else {
$("#previousSet").removeClass("disabled");
}
if (cC == (totalCards - 1)) {
$("#nextSet").addClass("disabled");
} else {
$("#nextSet").removeClass("disabled");
}
});
$("#nextSet").click(function() {
console.log(cC);
if (cC < (totalCards - 1)) {
++cC;
$('#containerFront').text(aCards[cC].t);
$('#containerBack').text(aCards[cC].d);
} else {
console.log("cC is not less than or equal the total number of cards!");
}
});
$("#previousSet").click(function() {
console.log(cC);
if (cC > 0) {
--cC;
$('#containerFront').text(aCards[cC].t);
$('#containerBack').text(aCards[cC].d);
} else {
console.log("cC is not greater then 0!");
}
});
});
</script>