jQuery Mobile 列表视图：单击时更改值

Posted 2023-05-09

【中文标题】jQuery Mobile 列表视图：单击时更改值

【英文标题】：jQuery Mobile List View: Change a Value When Clicked

【发布时间】：2012-03-24 10:30:36

【问题描述】：

我在表述我的问题时遇到了问题。所以我在 jQuery mobile 中有一个列表视图，它是动态创建的。我不想在单击列表项时链接到外部页面，而是希望能够获取他们单击的项目的文本。

在我的例子中，它是一个名称列表，我想知道他们点击了哪一个。我用 html 创建了列表：

<div data-role="content" data-theme="b">

        <div id="friends_list_view" class="content-primary" data-theme="c"> 
            <ul data-role="listview" data-filter="true" data-theme="c">
            </ul>
        </div>  
    </div>

当单击一个项目时，我想使用他们选择的名称运行一些功能。我该怎么做？

然后动态更新它：

var listString = null;
for(i in session_library)
        listString =  '<li><a href="#">'+session_library[i]['name']+'</a></li>';
        $("#friends_list_view ul").append(listString);



$("#friends_list_view ul").listview('refresh');

【参考方案1】：

假设您的列表视图如下所示：

<ul data-role="listview" data-filter="true" data-theme="c" id="my_listview">
         <li>Row A</li>
         <li>Row B</li>
</ul>

您可以注册一个单击事件处理程序，它将返回<li> 文本，例如

$('#my_listview').delegate('li', 'click', function () 
    alert(this.innerText);
 );    
​

编辑：将vclick 更改为click。请参阅documentation。

【讨论】：

小心vclick。在某些操作系统（android click 在触发之前有一个延迟，但这是设计使然，因此设备可以决定用户是在点击、按住还是滑动。

啊，好的，谢谢。请参阅相关文档：jquerymobile.com/test/docs/api/events.html。我还没有在click 和vclick 上看到警告。