これに対する答えが見つかりません。JQM ドキュメントとスタックオーバーフローの質問を読みました。
#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');
});
2019 年 3 月の調査結果 (これはトワイライト ゾーンです。修正を歓迎します)
- 分割ボタンは、最初のボタンの中に 2 番目のボタンを配置すると、プログラムで拡張されないように見えます
<a>(ただし、純粋な HTML で設定すると機能します)。 <li>s既に HTML に含まれているものを変更する必要がある場合は、既に強化されている itens には影響しないpagebeforecreateため、変更を加えたほうがよいでしょうlistview('refresh')。listview('create'); を使用するには、リスト全体をやり直す必要があります。- これはほとんど私が探していたものです: http://jsfiddle.net/ffabreti/Q4SCt/1/ (
http://jsfiddle.net/Gajotres/LrAyE/
に基づく)
質問への回答 最後に、pagecreate の後に分割ボタンを挿入する方法を見つけました。
pagecreate元のリストコンテンツでグローバル変数を設定する- イベントをフックしてリストを変更します (例、
$("div[data-role='header']").on('click'...) - 元のリストを複製して編集する
- リストの内容を編集した内容に置き換える
- リストビュー コンポーネントの更新
- ここで完全なコードを見ることができます: http://jsfiddle.net/ffabreti/Hyams/11/