Question

我有一个无序的项目列表 - 这个列表可能长达数百个项目 - 当用户点击一个项目时，我会在选项右侧显示他们的选择。我正在使用jQuery selectable和sortable的组合来执行此操作（尽管我在单击选项时丢失了可排序的选项），并且为用户显示的值是所选项的索引。我希望显示用户的订单项的文本值，但正如预期的那样，抓取text（）值会返回所有订单项的文本值。

如何为用户抓取所选文本并显示？

HTML：

<ul id="list">
    <li id="Test1">Item 1</li>
    <li id="Test2">Item 2</li>
    <li id="Test3">Item 3</li>
    <li id="Test4">Item 4</li>
    <li id="Test5">Item 5</li>
</ul>

<p id="feedback">
<span>You've selected items:</span>    
    <ul id="select-result">
     <span id="select-resultSpan">
        <li>No Items Selected</li>
     </span>
    </ul>    
</p>

JS：

$(function () {
    $("#list").selectable({
        stop: function () {
            var result = $("#select-resultSpan").empty();
            $(".ui-selected", this).each(function () {
                var index = $("#list li").index(this);
                result.append("<li>" + (index + 1) + "</li>");
            });
        }
    });
});

JSFiddle的完整示例：http://jsfiddle.net/Jk6ZH/1/

提前致谢。

Answer 1

如果我正确读到这一点，请认为这就是你所需要的：

$(".ui-selected", this).each(function () {

    // this works for me
    result.append("<li>" + $(this).text() + "</li>");
});

http://jsfiddle.net/JuJDt/

Answer 2

试试这个：

$("#list li").on("click",function() {
  $("#select-resultSpan").append($(this).text());
})

Answer 3

You have to find innerHTML from index value.
you can also get other attributes with this method.

$(function () {
        $("#list").selectable({
            stop: function () {
                var result = $("#select-resultSpan").empty();
                $(".ui-selected", this).each(function () {
                    var index = $("#list li").index(this);
                    var text = $("#list li").get(index).innerHTML; //  for id you can replace .innerHTML with .id 
                    result.append("<li>" + (text) + "</li>");
                });
            }
        });
    });

jQuery可选获取文本值

3 个答案:

see here