我想知道如何在JQuery可排序的每个项目上放置一个按钮。现在,我在屏幕顶部有一个按钮,可以将自动完成中的用户输入添加到可排序。这是我的.js代码,它为我的sortable添加了新项目:
$(".addButton").click(function(e) {
e.preventDefault();
// set var item to be the string inputted by the user
var item = $("input[name='inputItem']").val(); //where 'inputItem' is the name of the <form> which contains the <input>
// parses input string, splitting at commas into liArray containing substrings as elements
var liArray = item.split(", ");
// for loop to add each brew to the sortable list (length-1 because last element in array is empty string)
for (var i = 0; i < liArray.length-1; i++) {
// sets var $li to the string in the ith index of liArray
var $li = $("<li class='ui-state-default'/>").text(liArray[i]);
// adds var $li to gui
$("#sortable").append($li);
};
$("#sortable").sort();
// refreshes the page so var $li shows up
$("#sortable").sortable("refresh");
});
我的想法是添加类似
的内容<button>Button!</button>
到这一行:
var $li = $("<li class='ui-state-default'/>").text(liArray[i]);
但我不知道如何完全实现它。任何帮助,将不胜感激。谢谢!
答案 0 :(得分:1)
试试这个。
$("<li class='ui-state-default'/>").text(liArray[i]).append('<button>Button!</button>');