我正在尝试使用 jQuery 构建一个调查创建者模块，该模块构建各种类型的问题。从一个包含一个问题和几个选项的多项选择问题开始。我已经编写了以下代码。
$(function () {
$("#sortable").sortable({
});
});
$('#sortable3').sortable({
//helper: 'clone',
//placeholder: 'ui-state-highlight',
//opacity: '.5',
start: function (event, ui) {
$(ui.item).show();
}
});
(function () {
$("#txt").live('click', function () {
var $ctrl = $('<input type="text" name="inputtext" value="Enter Your Questions Here..."> <br /> <label>Required.? </label> <input type="checkbox" value="required"> <br /><input type="text" name="inputtext" value="Enter Notes Here..."> <br />').addClass("text");
$("#holder").append($ctrl);
var $options = $('<ul id="sortable3"><li>Item 1</li><li>Item 2</li><li>Item 3</li><li>Item 4</li><li>Item 5</li></ul>');
$("#holder").append($options);
});
})();
(function () {
var i = 3;
//var num = i++;
$(".addChoices").live('click', function () {
var $opt = $('<div id="div' + ++i + '" ><input type="text" name="inputtext" value="choice ' + i + ' " id="txt" + i++ +> <span class="addChoices"> + </span> <span class="removeChoices" id="' + i + '"> - </span> </div>');
$("#options").append($opt);
//alert("Add");
});
})();
(function () {
$(".removeChoices").live('click', function () {
alert("Getting Id " + $(this).attr('id'));
var $idRem = $(this).attr('id');
var div = $(this).attr('id');
//alert("div"+div);
var divId = "div" + div;
$("#" + divId).remove();
});
})();
HTML
<div style="display:inline">
<input type="button" id="txt" value="Add Text Box" style= " " />
</div>
<div id="holder"> </div>
<div id="options"> </div>
现在，当我单击一个按钮时，它会添加问题和一些选项。我可以添加或删除选项。现在我想让选项可排序，以便用户可以按照他希望它出现的顺序排列它。