jQuery Выбираемый Получить текстовое значение

У меня есть неупорядоченный список элементов - этот список может состоять из сотен элементов в длину - и когда пользователь щелкает элемент, я отображаю их выбор справа от параметров. Для этого я использую комбинацию выбираемых и сортируемых jQuery (хотя я теряю сортируемую при щелчке по опции), а отображаемое для пользователя значение является индексом выбранного элемента. Вместо этого я хочу отобразить текстовое значение позиции для пользователя, но, как и ожидалось, захват значения 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/

Заранее спасибо.

3 ответа

Решение

Если я правильно читаю, подумайте, что это все, что вам нужно:

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

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

http://jsfiddle.net/JuJDt/

Попробуй это:

$("#list li").on("click",function() {
  $("#select-resultSpan").append($(this).text());
})
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>");
                });
            }
        });
    });

http://jsfiddle.net/Jk6ZH/42/

Другие вопросы по тегам