我手风琴有子手风琴。当用户点击"新主题"按钮它将通过克隆列表中的第一个手风琴来创建一个新的手风琴。然而,当发生这种情况时,子手风琴不能对增加的额外手风琴进行排序,但前两个初始手风琴的子手风琴是可以分类的。
当您尝试对它们进行排序时,您可以看到手风琴拖动但位置不会更新,它只会返回到原始位置。
关于为什么会发生这种情况的任何想法?下面是我到目前为止编写的JQuery代码以及演示链接。
由于
var counter = 1;
var subCounter = 1;
var deleteSubcounter = 1;
var deleteCounter = 1;
var subFormCounter = 1;
$(function() {
indexFunction();
$('.accordion h3').click(function() {
if ($(this).next().is(':hidden')) {
var buttons = $(".remove")
$(this).find(buttons).hide();
} else {
$(".remove").show();
}
});
$('.Subgroup h3').click(function() {
if ($(this).next().is(':hidden')) {
var buttons1 = $(".removeSub")
$(this).find(buttons1).hide();
} else {
$(".removeSub").show();
}
});
$("#num").click(function() {
var aName = "accordion" + (counter + 1);
var tName = "subtopic" + (counter + 1);
var tInfo = "subtopicText" + (counter + 1);
var headerText = "Topic " + (counter + 1);
var buttonName = "submitInfo" + (counter + 1);
var divID = "abc" + (counter + 1);
var formID = "form" + (counter + 1);
var formTextName = subFormCounter + "subtopicText" + subCounter;
var subtopicName = subFormCounter + "subtopic" + subCounter;
var subPosition = subFormCounter + "position" + subCounter;
var subButtonName = subFormCounter + "submitButton" + subCounter;
var divSubName = (subFormCounter + 1) + "subAccordion" + subCounter;
counter++;
subFormCounter++;
indexFunction();
$(".group1:first").clone(true).appendTo("#main");
$(".group1:last").attr("name", aName);
$(".remove:last").css("visibility", "visible");
//$(".group1:last").attr("id", divID);
if (counter == 10) {
$("#num").attr("disabled", "disabled");
} else if (counter < 10) {
$("#num").removeAttr("disabled");
}
indexFunction();
});
$(".remove").click(function() {
$(this).parent().parent().remove();
counter--;
if (counter < 10) {
$("#num").removeAttr("disabled");
}
indexFunction();
});
$(".removeSub").click(function() {
$(this).parent().parent().remove();
subCounter--;
});
$("div.accordion")
.accordion({
header: "> div > h3",
collapsible: true,
heightStyle: "content",
active: false
})
.sortable({
axis: "y",
handle: "h3",
stop: function(event, ui) {
// IE doesn't register the blur when sorting
// so trigger focusout handlers to remove .ui-state-focus
ui.item.children("h3").triggerHandler("focusout");
indexFunction();
// Refresh accordion to handle new order
$("this").accordion("refresh");
}
});
$(".newSub1").click(function() {
if($('.accordion').hasClass('ui-accordion-content-active'))
{
var test = $( ".accordion" ).accordion( "option", "active" );
var active = $(".accordion #sub").eq(test)
var subName = "subAccordion" + (subCounter + 1);
var formName = "form" + (subCounter + 1);
var formTextName = subFormCounter + "subtopicText" + (subCounter + 1);
var subtopicName = subFormCounter + "subtopic" + (subCounter + 1);
var subPosition = subFormCounter + "position" + (subCounter + 1);
var subButtonName = subFormCounter + "submitButton" + (subCounter + 1);
var divSubName = subFormCounter + "subAccordion" + (subCounter + 1);
var divID = "abc" + (counter + 1);
subCounter++;
$(".Subgroup:first").clone(true).appendTo(active);
$(".info1:last").children(".formText1").val("");
$(".info1:last").children(".formText2").val("");
$(".info1:last").children(".formText3").val("");
$(".removeSub:last").css("visibility", "visible");
//var testIndex = $( ".Subgroup" ).index();
//$(".formText3").val(testIndex);
//$(".group1:last").attr("id", divID);
}
/*if (subCounter == 10) {
$(".newSub1").attr("disabled", "disabled");
} else if (counter < 10) {
$(".newSub1").removeAttr("disabled");
}*/
});
});
var indexFunction = function() {
var test1 = ($('div#abc1').index() + 1);
var test2 = ($('div#abc2').index() + deleteCounter);
var test3 = ($('div#abc3').index() + deleteCounter);
var test4 = ($('div#abc4').index() + deleteCounter);
var test5 = ($('div#abc5').index() + deleteCounter);
var test6 = ($('div#abc6').index() + deleteCounter);
var test7 = ($('div#abc7').index() + deleteCounter);
var test8 = ($('div#abc8').index() + deleteCounter);
var test9 = ($('div#abc9').index() + deleteCounter);
var test10 = ($('div#abc10').index() + deleteCounter);
$("#form1").children(".formText3").val(test1);
$("#form2").children(".formText3").val(test2);
$("#form3").children(".formText3").val(test3);
$("#form4").children(".formText3").val(test4);
$("#form5").children(".formText3").val(test5);
$("#form6").children(".formText3").val(test6);
$("#form7").children(".formText3").val(test7);
$("#form8").children(".formText3").val(test8);
$("#form9").children(".formText3").val(test9);
$("#form10").children(".formText3").val(test10);
};
答案 0 :(得分:0)
看起来你在创建新手风琴时没有给.sortable
打电话。