0

我找不到这个问题的答案，我已经阅读了 JQM 文档和 stackoverflow 问题。

我有一个#lista-principal需要完全相同的拆分按钮的列表视图

拆分按钮打开一个弹出窗口，让用户选择要插入的类。插入通过 jquery 使用$('a.ui-li-link-alt').on('click'...

这里是 JSBin： http: //jsbin.com/akerav/15/edit （点击标题触发问题）

由于拆分按钮都是相等的，我希望以编程方式插入。我找不到这样做的方法，因此 JQM 会刷新拆分按钮。

在 JQM 页面中以编程方式插入拆分按钮的正确方法是什么？

出于测试目的，我将有问题的代码放在了这个点击函数中：

$('div[data-role="header"]').click( function() {

       var split_button = $('<a></a>') 
         .attr({
             'data-rel':'popup', 
             'data-position-to':'origin', 
             'data-transition':'slidedown'
          })
         .html('Vistoria');

       var newli = $('ul#lista-principal li').clone();
       newli.find('a').append(split_button);
       $('ul#lista-principal li').remove();
       $('ul#lista-principal').append(newli);
       newli.trigger('create');
       $('ul#lista-principal').listview('refresh');
    });

3 月 19 日的调查结果（这是暮光区，欢迎更正）

  • 如果您将第二个放在第一个里面，看起来拆分按钮不会以编程方式得到增强<a>（尽管如果您将它设置在纯 HTML 上它可以工作）；
  • 如果你需要修改一堆<li>s已经在 HTML 中的，你最好继续这样做，pagebeforecreate因为listview('refresh')这不会影响已经增强的 itens，你应该重做整个列表以使用 listview('create');
  • 这几乎是我一直在寻找的：http: //jsfiddle.net/ffabreti/Q4SCt/1/
    （基于http://jsfiddle.net/Gajotres/LrAyE/）

对问题的回答 最后找到了一种在pagecreate之后插入split-buttons的方法：

  • 使用原始pagecreate列表内容设置全局变量
  • 挂钩事件以更改列表（例如，$("div[data-role='header']").on('click'...）
  • 克隆您的原始列表并进行编辑
  • 用编辑后的内容替换您的列表内容
  • 刷新列表视图组件
  • 你可以在这里看到完整的代码：http: //jsfiddle.net/ffabreti/Hyams/11/
4

0 回答 0