1

我创建了一个函数,以便在通过按钮调用该函数时加载该函数。但它仅在我刷新页面时有效,但在我点击交换按钮时无效。

这是链接http://www.onlinedemowebsite.com/design/swatch/drag-and-drop/try3.html

谁能帮我解决这个问题。

谢谢

4

1 回答 1

1

您在交换按钮上有 onclick="shuffle()" 并且该函数未在将触发事件的全局范围内定义。将函数移动到窗口范围,或者创建 DOM 节点并将真实事件附加到它而不是使用 document.writeln

此外,shuffle 函数使用 document.writeln,一个示例是修改它并改为执行以下操作:

function shuffle(){
    //organize and sort your letters here
    var letters = ....
    //query for all elements with class = 'letters' use a library if you want full browser support.
    var letter_nodes = document.querySelectorAll("div.letters"); 

    for ( var i = 0, n = letter_nodes.length; i<n; ++i ) {
        letter_nodes[i].innerHTML = letters[i]; // letters and letter_nodes array should have the same length.
    }
}

编辑:

将您的随机播放功能更改为如下所示:

var letters=['A','B','E','F','O','M','I','T']; //to access letters.length in the other function
function shuffle(){
    letters.sort(function(){return 0.5 - Math.random();});

    var letter_nodes = document.getElementById('lettersContainer');
    letter_nodes = letter_nodes.getElementsByTagName('div');        

    for ( var i = 0, n = letter_nodes.length; i<n; ++i ) {
        letter_nodes[i].innerHTML = letters[i];
    }

    return false;
}

然后更改创建容器的部分(在 print_2d_string_array 中)

    document.writeln ("<a href='#' onclick='return shuffle()' class='swap'>Swap</a>");
    document.writeln ("<div id='lettersContainer'>");

    for ( var i = 0; i < letters.length; ++i ) {
    document.writeln ("<div class='letters'></div>");
    }

    shuffle();
    document.writeln ("</div>"); /* lettersContainer end */
于 2012-04-11T09:52:44.083 回答