组合多个滚动div

Question

将可滚动div放在另一个可滚动div中时，我遇到了麻烦。这是html代码

<div id="wrapper">
<div id="scroller" >
        <div id="wrapper1" style="height: 200px;">
            <div>
                <ul id="thelist1">
                    <li>Pretty row 1</li>
                    <li>Pretty row 2</li>
                    <li>Pretty row 3</li>
                    <li>Pretty row 4</li>
                </ul>
            </div>
        </div>
        <div id="wrapper2" style="height: 200px;">
            <div>
                <ul id="thelist2">
                    <li>Pretty row 1</li>
                    <li>Pretty row 2</li>
                    <li>Pretty row 3</li>
                    <li>Pretty row 4</li>
                </ul>
            </div>
        </div>
        <div id="wrapper3" style="height: 200px;">
            <div>
                <ul id="thelist3">
                    <li>Pretty row 1</li>
                    <li>Pretty row 2</li>
                    <li>Pretty row 3</li>
                    <li>Pretty row 4</li>
                    <li>Pretty row 5</li>
                </ul>
            </div>
        </div>
        <div id="wrapper4" style="height: 200px;">
            <div>
                <ul id="thelist4">
                    <li>Pretty row 1</li>
                    <li>Pretty row 2</li>
                    <li>Pretty row 3</li>
                    <li>Pretty row 4</li>
                    <li>Pretty row 5</li>
                </ul>
            </div>
        </div>  
</div>

我正在使用iscroll插件：

var myScroll;
function loaded() {
myScroll = new iScroll('wrapper');
myScroll1 = new iScroll('wrapper1');
myScroll2 = new iScroll('wrapper2');
myScroll3 = new iScroll('wrapper3');
myScroll4 = new iScroll('wrapper4');
}

问题是滚动内部div的事件与外部div之一发生冲突。因此，当我滚动其中一个内部div时，我发现自己滚动了一个大包装div。

有没有办法只滚动我正在触摸的div？