jQuery UI LISTVIEW不刷新

Question

使用jQuery UI（w/jquery 1.9.1）。我有一个可排序的列表。我通过表单添加了dom元素。用户点击一个按钮，会出现一个对话框。用户在文本框中键入文本并点击“添加页面”。一个新的列表项目将追加到列表中。问题是该列表视图不包含正确的CSS。

继承人的jsfiddle - >http://jsfiddle.net/RQKng/1/

之前，你按一下红色按钮，你可以在列表项之间单击，并注意选中的列表项变为蓝色。但是，任何新项目都不会变成蓝色。

我尝试：

$('#pageList ul').trigger('create').listview('refresh'); 

但是我收到该 '对象没有方法 “列表视图”'

Answer 1

1错误：问题是在这条线：

$('.page').click(function() { 
     $('.page').removeClass('selected'); 
     $(this).addClass('selected'); 
    }); 

2 ：解决方法如下：jsFiddle

3：一些解释：

因为你有事先不知道的动态元素，所以你必须让jQuery意识到这一点。从jQuery docs：

事件处理程序仅绑定到当前选定的元素;在代码调用.on（）时，页面上必须存在 。

你想要的是这样的：

Delegated events have the advantage that they can process events from descendant 
elements that are added to the document at a later time. 

解决方案：

$('.item-list').on("click","li",function() { 
    $('.page').removeClass('selected'); 
    $(this).addClass('selected'); 
});