麻烦的setInterval和setTimeout的工作

这使用Raphaeljs从数组中绘制一个弦：麻烦的setInterval和setTimeout的工作

function createChordStruct(key, string, shape) { 
    var string = string.toUpperCase(); 
    var position = positions[string][key]; 
    var struct = chord_shapes[shape]; 

return { 
    name: key + struct.name, 
    chord: struct.chord, 
    position: position, 
    position_text: struct.position_text, 
    bars: struct.bars 
    } 
} 

function createChordElement(chord_struct) { 
    var chordbox = $('<div>').addClass('chord'); 
    var chordcanvas = $('<div>'); 
    var chordname = $('<div>').addClass('chordname'); 

chordbox.append(chordcanvas); 
chordbox.append(chordname); 
chordname.append(chord_struct.name); 


var paper = Raphael(chordcanvas[0], 150, 140); 
var chord = new ChordBox(paper, 30, 30); 

chord.setChord(
    chord_struct.chord, 
    chord_struct.position, 
    chord_struct.bars, 
    chord_struct.position_text); 
chord.draw(); 

return chordbox; 


} 

function createSectionElement(section_struct) { 
    var section = $('<div>').addClass('section'); 
    var section_title = $('<div>').addClass('title'); 
    var section_desc = $('<div>').addClass('description'); 

    section.append(section_title); 
    section.append(section_desc); 
    section_title.append(section_struct.section); 
    section_desc.append(section_struct.description); 

    return section; 

}

而这需要来自阵列创建的每个和弦，并把它们放在一个名为“chordscroller”新的div：

function c_i() { 


var randomholder = 'id_' + (Math.floor(Math.random() * 100005) + 1); 
var randomId = 'id_' + (Math.floor(Math.random() * 100005) + 1); 
$(function() { 
    $('#sortable').append($('<li id ="' + randomholder + '" class="chordbox"><span id="i"  class="scale">C - I</span><span id="' + randomId + '" class=" even scrollpane chordscroller"></span></li>').sortable("refresh")) 
    }); 


function c_one() { 
    var container = $("#" + randomId + ""); 
    var column = null; 
    var column = _.shuffle(c_1); 


for (var i = 0; i < column.length; ++i) { 
    var section_struct = column[i]; 
    var section = createSectionElement(section_struct); 

    for (var j = 0; j < section_struct.chords.length; ++j) { 
    section.append(createChordElement(section_struct.chords[j])); 

    } 

container.append(section); 
} 


} 



$(function() { c_one() }); 


}

问题是它在同一时间绘制所有的和弦，它需要永远。我已经尝试了setTimeout和setInterval的所有组合，但我仍然遇到错误。

有人可以从这段代码告诉如何让一次一个而不是一次绘制一个和弦？

来源

2012-09-06 jthomasbailey

纠正我，如果我错了，但我既没有看到'setTimeout'也不'你已经发布代码的任何地方setInterval'。还有更多吗？ –

我把它们拿出来，因为它们只是破坏东西。有*许多*变化。 – jthomasbailey

如果你可以用一个工作的例子建立一个jsbin环境会有所帮助。 – Jeemusu

终于想通了（使用一种称为doTimeout插件）：

$.doTimeout(1, function() { 
    chord.setChord(
    chord_struct.chord, 
    chord_struct.position, 
    chord_struct.bars, 
    chord_struct.position_text); 
    chord.draw(); 


});

来源

2012-09-06 11:28:07 jthomasbailey

麻烦的setInterval和setTimeout的工作

回答

相关问题