使用 swipe.js 生成滑动对象答案

【问题标题】：generating swipe objects with swipe.js使用 swipe.js 生成滑动对象
【发布时间】：2012-01-20 08:50:37
【问题描述】：

使用 swipe.js (www.swipejs.com)，我想将其附加到生成的 DIV。

在 JavaScript 循环中，我正在执行以下操作：

$.each( data, function( i, item)  {

resultHtml = '<div id="swipe-div-' + item.i  + '" class="swipe">' +
'<ul>' +
'<li>Test 1<li>' +
'<li>Test 2<li>' +
'</ul></div>' +
'<a href="#" onclick="swipe-div-' + item.i + '.prev();return false;">prev</a>' +
'<a href="#" onclick="swipe-div-' + item.i + '.next();return false;">next</a>';

$('div#results').append( resultHtml );

new Swipe(document.getElementById('swipe-div-' + item.i));

}

：我的上一个和下一个链接有问题。我怀疑这可能与以下行有关：

new Swipe(document.getElementById('swipe-div-' + item.i));

没有正确初始化滑动对象。

当我点击 prev 或 next 时，我在 Javascript 控制台中收到以下错误：

“Uncaught SyntaxError: Unexpected token ILLEGAL”

我该如何解决这个问题？

【问题讨论】：

标签： javascript swipe

【解决方案1】：

好的，既然没有人回答这个问题，我想出了如何解决我自己的问题：

我没有生成和附加文本字符串，而是使用 document.createElement 和 appendChild 创建了结构。

在创建结构的最后，我添加了以下代码：

var slider = new Swipe(document.getElementById('result-' + item.i));
clickPrev(slider, prev);
clickNext(slider, next);

并添加了以下功能：

function clickNext(swipeObj, link) {
    link.onclick = function () {
        swipeObj.next();
        return false;
    }
}

function clickPrev(swipeObj, link) {
    link.onclick = function () {
        swipeObj.prev();
        return false;
    }
}

这种方式更容易遵循，现在效果很好。

【讨论】：