JQuery的 - 如何生成与生成的股利和<select>标签

层次我必须做一些形式和产生与之格但在这里，这不是我的问题。JQuery的 - 如何生成与生成的股利和<select>标签

其实，我想知道如何创建这样的事情发生的div之间的层次，主要演员将是<select>标签。

这里是我想什么有一个形象。例如，当我创建一个章节并将其与我之前生成的Book 1相关联时，则该章节附加在正确的“book”div内。或者另一个例子，如果我想创建一个特定的线块。我希望它在正确的章节块本身在正确的书籍块。

我不知道我是不是很清晰和准确的，但这里是我的小提琴实际代码：https://jsfiddle.net/Uxrieg/hctr0xbh/16/

而且我目前jQuery脚本：

$("#select").change(function(){ 
    var val = $(this).val(); 
    $("#select-choice > div").hide(); 
    $("." + val).slideToggle(); 
}); 

    $('#createBook').click(function(){ 
    var listItem = $('#bookName').val(); 
    var clearButton = $('<button value="x" id="clear"></button>'); 
    //console.log(listItem); 
    $('#list').append('<div class= "BookName">' + listItem +'<input type=button class="item" value=X />' + '</div>'); 
    $('#bookName').val(' '); 
}); 

$('#createChapter').click(function(){ 
    var listItem = $('#chapterName').val(); 
    var clearButton = $('<button value="x" id="clear"></button>'); 
    //console.log(listItem); 
    $('#list').append('<div class= "ChapterName">' + listItem +'<input type=button class="item" value=X />' + '</div>'); 
    $('#chapterName').val(' '); 
}); 

$('#createLine').click(function(){ 
    var listItem = $('#lineName').val(); 
    var clearButton = $('<button value="x" id="clear"></button>'); 
    //console.log(listItem); 
    $('#list').append('<div class= "LineName">' + listItem +'<input type=button class="item" value=X />' + '</div>'); 
    $('#lineName').val(' '); 
}); 

$(document).on('click', '.BookName', function(){ 
    //console.log('clicked'); 
    $(this).remove(); 
}); 

$(document).on('click', '.ChapterName', function(){ 
    //console.log('clicked'); 
    $(this).remove(); 
}); 

$(document).on('click', '.LineName', function(){ 
    //console.log('clicked'); 
    $(this).remove(); 
});

感谢很多提前，如果你能解决我的问题或者只是帮助我。祝你有美好的一天！ =）

来源

2017-02-21 Uxrieg

你只需要改变的追加选择调用章和行：

$('.BookName', '#list').append('<div class= "ChapterName">' + listItem +'<input type=button class="item" value=X />' + '</div>');

$('.ChapterName', '#list').append('<div class= "LineName">' + listItem +'<input type=button class="item" value=X />' + '</div>');

请记住，如果没有书已经被创建，然后添加章节/行将不会执行任何操作，如果没有创建章节，则添加行将不会执行任何操作。此代码将在所有已打开的书籍或所有创建的章节中的新行中创建一个新章节。如果您需要更具体，那么您需要添加更多逻辑并更改您的选择器。

更多关于jquery选择器在这里：https://api.jquery.com/category/selectors/

来源

2017-02-21 16:08:48 artemisian

JQuery的 - 如何生成与生成的股利和<select>标签

回答

相关问题