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>");
});
Попробуй это:
$("#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>");
});
}
});
});