选定的指数问题

时间:2013-07-26 13:39:40

标签: jquery jquery-mobile

请找到以下代码

HTML

<div data-role="page" id="pge">
    <div data-role="content">

        <fieldset class="filedSetRow">
            <div class="disPly">
                display 1
            </div>    
        </fieldset>

        <fieldset class="filedSetRow">
            <div class="disPly">
                display 2
            </div>
        </fieldset>

    </div>
</div>

JS

$(document).on('pageinit','#pge',function (event, ui){
   alert($('.disPly').length);
});

$(document).on('vmouseup','.disPly',function (event, ui){
    alert($(this).index());
});

实际上问题是当我点击'.disPly'时,没有执行相应的索引。在这种情况下有什么问题!总是只有'0'。

预期结果是'.disPly'的点击索引。

提前致谢...

2 个答案:

答案 0 :(得分:3)

问题是index()将获得具有相同父级的兄弟姐妹列表中的索引。在这种情况下,每个字段集中只有1个子div。

您可以改用以下内容:

alert($("#pge .disPly").index(this));

Here is a working example(注意:我将其更改为使用click事件)

答案 1 :(得分:0)

jQuery index()根据其兄弟姐妹返回元素的索引。在你的例子中,你的类disPly div在他们的父母中是独自的,因此你总是会得到0作为索引。

如果您想知道其父级的索引,这在查看代码时更合适,请执行以下操作:

$(document).on('vmouseup','.disPly',function (event, ui){
    //Get a list of elements we want to compare, and get index of event target.
    alert($(this).parent().siblings().index($(this).parent()));
});