如何在動態創建的列表中創建嵌套列表項？

Question

新手在這里。 我需要一點幫助

我有一個空的ul，當用戶填寫表單並單擊“保存”時，它會向其中添加列表項。 我正在嘗試對其進行設置，以便他們可以雙擊添加的列表項，然后通過jQuery UI對話框窗口中的另一種形式向該項添加更多信息，並將其保存在嵌套列表中。

該應用是基本的D＆D主動跟蹤器，DM可以添加玩家及其主動以及敵人，並自動將他們從最高主動降到最低。 嵌套列表將用於播放器/敵人上的效果。

到目前為止，這是我的代碼的jsfiddle，我添加了一個列表項，因此您只需雙擊即可查看模式，而無需填寫表格： jsfiddle

這是我能夠得到的最接近的。 它將信息添加到對話框窗口，而不是列表項。 我嘗試過的所有其他操作都給了我錯誤。

以下是相關代碼：

var conName
var duration
$('ul').on('dblclick', 'li', function(){

    $('#modal').dialog({
        title: 'TEST',
        buttons: [ { 
            text : 'save', 
            click: function() {
                conName = $('#con').val();
                duration = parseInt($('#dur').val()); 
                $(this).parent().append('<li>' + conName + ' ------ ' + duration + '</li>' );
}}]
    });

謝謝你的幫助！

Answer 1

var conName
var duration
$('ul').on('dblclick', 'li', function(){
    _this = $(this);
    $('#modal').dialog({
        title: 'TEST',
        buttons: [ { 
            text : 'save', 
            click: function() {
                conName = $('#con').val();
                duration = parseInt($('#dur').val()); 
                _this.find('.subName').html(conName);
}}]
    });

您可以在jsfiddle中查看。