结合$(this)和$("li:eq(ui.item.index())")
结合$(this)和$("li:eq(ui.item.index())")是指在JavaScript编程中，使用jQuery库来操作DOM元素。在这个例子中，$(this)表示当前的DOM元素，而$("li:eq(ui.item.index())")表示一个具有特定索引值的li元素。
在前端开发中，这种操作通常用于实现自动完成、拖拽排序等功能。例如，在实现一个自动完成功能时，我们可以使用$(this)来获取当前输入框的值，并通过$("li:eq(ui.item.index())")来获取匹配的li元素，从而实现自动完成的效果。
以下是一个简单的示例代码：
$("#input").autocomplete({
source: ["apple", "banana", "orange"],
select: function(event, ui) {
$(this).val(ui.item.value);
$("li:eq(ui.item.index())").addClass("selected");
}
});在这个示例中，当用户从自动完成列表中选择一个选项时，当前输入框的值将被设置为选中项的值，并且匹配的li元素将被添加一个"selected"类。
总之，结合$(this)和$("li:eq(ui.item.index())")可以帮助我们更方便地操作DOM元素，实现更丰富的交互效果。
相关·内容
使用jQuery，我如何将$(this)和$("li:eq(ui.item.index())")组合成像$(this).$("li:eq(ui.item.index())").id这样的东西？
我正在尝试获取使用jQuery UI工具包创建的可排序列表中的列表元素的id属性
$(".sections-list").sortable({ /* Update position of sortable elements */
start: function(event, ui) {
var start = ui.item.i
浏览 0提问于2012-08-07得票数 1
如果用户在一个ul上执行排序，那么应该在另一个ul上执行相同的操作，我必须对两个相同的ul进行排序，具有相同的类和相同的li元素。
code:
<ul class="sort">
<li>a</li>
<li>b</li>
<li>c</li>
<li>d</li>
</ul>
<ul class="sort">
<li>a</li>
<li>b</li>
<li>c
浏览 4提问于2014-06-04得票数 1
回答已采纳
2回答
我有一个ul列表和一个multipe选择框，我想知道如何使用Jquery使用可排序选项作为li元素进行排序(我必须开始/停止排序位置)。
示例(我的)：
<select id="myselect" multiple>
<option value="vA">A</option>
<option value="vB">B</option>
<option value="vC">C</option>
<option value="v
浏览 3提问于2014-05-15得票数 0
回答已采纳
1回答
我的设计中有一个以上的表，在表上使用了jQuery UI可排序函数，它的工作正常，但是当我选择或排序第一个表行上的工作时，也要对其他表行进行排序，就像在其他表行中的第一个表行中拖放的第一个表行中的第一个表行中具有相同索引的第一个表行索引同时执行可排序操作一样。所有表都有相同的行数
就像下面有三张桌子一样，
<table id="foo1">
<tbody>
<tr>
<td>First row</td>
</tr>
<tr>
<td&
浏览 1提问于2014-12-05得票数 0
回答已采纳
我有两份名单
<ul class="sortable" id="list-A">
<li id="1">Value 1 </li>
<li id="2">Value 2 </li>
<li id="3">Value 3 </li>
</ul>
<ul class="sortable" id="list-B">
<li id="4"
浏览 1提问于2012-11-23得票数 2
回答已采纳
我正在尝试创建脚本，这将允许我排序一些元素同时与其他元素。我创建了简单的jsfiddle来演示我到底在尝试什么。我有2行数字为1-5的元素，但sortable只是第一行。
<div class="demo1 demo">
<div id="sortable">
<div class="test">1</div>
<div class="test">2</div>
<div class="te
浏览 1提问于2015-01-14得票数 1
3回答
我使用jquery，得到了li及其属性的索引值。我想通过ajax发送索引值和属性值。这是我的代码：
$(function() {
$('ul').sortable({
start: function(event, ui) {
var start_pos = ui.item.index();
ui.item.data('start_pos', start_pos);
},
update: function(event, ui) {
var start_pos = ui.item.data('s
浏览 0提问于2019-03-20得票数 0
回答已采纳
1回答
我使用连接的可排序列表来实现两个列表框之间的拖放功能。如何找到选定的元素(或拖动后出现在第二个列表框中的列表项)，并将其发送到后台代码，以便将其保存到数据库中。我正在使用Linqdatasource进行数据库操作。我的java脚本是-
$(function () {
$("#Setter,#Getter").sortable({
connectWith: ".sortable",
recieve: function (e, ui)
{
var
浏览 0提问于2013-05-22得票数 0
如何使用可排序的jquery..。我希望拖曳图像是拖曳和物品移动.
<div class="container">
<div class="smallitems">
<div class="dragimage">
<a href="#select1" class="lablecircle active">1</a>
</div>
<div class="dragimage">
<
浏览 1提问于2014-06-25得票数 0
回答已采纳
我有下面的HTML
<ul id="sortable" class="ui-sortable">
<li id="369833" class="ui-state-default">
<li id="372915" class="ui-state-default">
<li id="276520" class="ui-state-default" style="">
<
浏览 2提问于2012-12-13得票数 0
回答已采纳
我有一个非常具体的问题，将jQuery UI可排序和可拖动一起使用。我希望能够在新拖动的元素的列表中获得索引/位置。如果我在列表中移动元素，就能得到这个结果。
$("#draggable").draggable({
cursor: "move",
helper: "clone",
connectToSortable: ".sortable"
});
$( ".sortable" ).sortable({
items: 'li',
stop: function(
浏览 3提问于2013-08-07得票数 0
2回答
如果我有一组想要集成的类，如下所示：
.g1 -> .g12
我该怎么做呢？
我有我想做的增量，我相信我写的很正确，但是我不知道如何将这个变量和.grain连接起来，所以每次点击我只能改变一个方块。
$("#grains").click(function(){
var x;
x++;
$(".grain").attr('src',"orangesq-01.png");
});
下面是我制作的列表项目：
<ul id="grains">
<li><img s
浏览 3提问于2012-06-26得票数 0
我正在尝试使用在超文本标记语言列表中重新排列一些项目。我已经让它正常工作了，但我被困在如何使用数据上。
我正在使用Codeigniter，并且正在通过串行将订单传递给我的Category控制器中的update_order方法。
我知道如何将它输入到数据库中，但我不确定如何使用序列号才能做到这一点。我假设它在某种POST变量中，但我不知道它是什么。
JS：
<script type="text/javascript">
$(document).ready(function() {
$("#order").sortable({
浏览 2提问于2012-06-29得票数 0
回答已采纳
我想知道我刚移动的元素的新位置(div id)。
我该怎么做呢？
<script>
$(function() {
$("#sortable").sortable({
update: function(event, ui) {
alert("New position: " + ui.item.index());
}
});
$( "ul.droptrue" ).sortable({
connectWith: "ul"
浏览 4提问于2011-07-13得票数 2
回答已采纳
4回答
我正在尝试定义一个指令sortable，它包装了jqueryui的可排序插件。
角度代码是：
module.directive('sortable', function () {
return function (scope, element, attrs) {
var startIndex, endIndex;
$(element).sortable({
start:function (event, ui) {
startIndex = ui.item.index();
浏览 0提问于2012-10-09得票数 12
回答已采纳
1回答
我正在尝试重新排序jquery可排序表中的元素，当它创建时，基于它们在列表中的顺序。
var CACHES = ["WayBack Machine", "Google Cache", "Coral CDN"];
var HTML = ["Google Cache", "WayBack Machine", "Coral CDN"];
$("#sortable").sortable({
stop: function(event, ui) {
console.lo
浏览 2提问于2014-07-13得票数 0
回答已采纳
我使用来允许用户混洗列表，但是stop事件返回整个列表。
所以我会处理：
$(this).children('li').each(function(index) {
但我真正想做的是只处理受影响的范围。我想我需要的是:被拖动的列表项，以及它被放在前面(或后面，方便的话)的列表项。这样，我就可以更新列表中受影响的范围，而不必更新整个列表。
也许我应该继续向每个列表项添加一个数据计数器属性，看看它们是否与索引不同。
浏览 2提问于2011-05-20得票数 1
回答已采纳
1回答
如何获取所有项目索引并在其更改位置后进行更新和保存
<ul id="sortable">
<li class="ui-state-default">Item 1</li>
<li class="ui-state-default">Item 2</li>
<li class="ui-state-default">Item 3</li>
<li class="ui-state-default">Item 4</
浏览 0提问于2019-08-20得票数 1
尝试创建与iPhone类似的排序功能。我注意到，当项目“滚动到”连接列表时，可排序项不会立即被连接列表检测到。
看看这个。您将注意到，当第一个列表中的可排序项滚动到第二个列表中时，不会立即触发。在触发事件之前，您必须先移动鼠标。当您在触发事件之前释放鼠标时，这将成为一个问题，该事件将该项保留在第一个列表中。这是一个jQuery错误吗？这附近有什么工作吗？
这是我的javaScript：
$(function () {
$("#sortable1, #sortable2").sortable({
connectWith: ".connectedSortable&#
浏览 0提问于2015-06-30得票数 0
回答已采纳
3回答
用拖放重新排序数组
、、、
我有一个这样的数组：
tableObj = [
{
label: 'here',
value: 36,
element: '$(the li that this info is about)',
index: 0
},
{
label: 'are',
value: 42,
element: '$(the li that this info is about)',
index: 1
},
{
label: 'some',
浏览 1提问于2017-09-22得票数 1
回答已采纳
2回答
我有可排序的项目列表(li's)。我需要添加可能性，以移动每个项目只向上+1位置索引或向下-1位置索引。(所以每个拖拽项目应该能够移动只有一个步骤向上或向下)。请帮助解决这个问题。谢谢。
浏览 2提问于2016-06-30得票数 0
1回答
我有一个基本的HTML表，启用jQuery的可排序功能来对表行进行排序。
我的最终目标是允许用户拖放行和/或列(如果他们愿意的话)。我知道可以传递给可排序的，但它似乎使所有单独的td单元格都可以移动--我只希望这适用于整个列或整个行(而不是单个单元格)。
我看过jQuery的，但是我很难弄清楚它是如何工作的；我不确定基本的可排序类是否能够处理这样的场景，或者我是否需要构造一些外部javascript来实现这一点。
如果我需要使用自己的javascript，那不是问题--问题是，我甚至不知道从哪里开始(会由事件侦听器处理吗？)我不是在找人来帮我解决这个问题--但我很好奇，是否有人知道这类事情是否
浏览 1提问于2021-10-09得票数 0
试图在下面的示例中获取索引是非常疯狂的。我正在使用这个基本代码：
在stop()事件上，我试图知道拖动的新元素的索引是什么。例如：
[Drag me down]
-------------
[Item 1]
[Item 2]
[Item 3]
[Item 4]
如果我以某种方式在Item 2和Item 3之间发布了新项目，我就需要得到一个2。如下所示，ui.helper.index()无效，因为它返回原始元素的索引(拖我向下拖放元素)：
$( ".sortable" ).sortable({
// ...
receive: function(
浏览 1提问于2017-08-16得票数 0
回答已采纳
1回答
jQuery排序中的自定义索引
、、、、
我使用jQuery sortable库创建了可排序的项目列表。
HTML :
<ul id="sortable">
<li id="item1" data-index="1">Item 1</li>
<li id="item2" data-index="2">Item 2</li>
<li id="item3" data-index="3">Item 3</li>
&l
浏览 2提问于2016-03-02得票数 1
2回答
当用户对列表进行排序时，div将根据列表的顺序更改位置。
因此，当用户更改可排序时，主部分中的div将发生变化。目前它不起作用
这是我的密码
$("#element-list").sortable({
stop:function(event, ui){
// new index
var index = ui.item.index();
var classs = $(ui.item).attr('class');
// find the correct div in the main div
浏览 7提问于2014-07-22得票数 0
回答已采纳
3回答
我在这个动画上坐了很长时间，想不出它的最佳工作方式。我希望第一和第二李项将慢慢fadeOut，同时第六和第七项将fadeIn，而所有项目缓慢地向左移动。这是我的动画样子，不是我想要的那样..
jQuery(document).ready(function() {
jQuery('.feedbak-logo li').slice(5).hide();
});
jQuery('.feedbak-logo li').click(function (){
jQuery('.feedbak-logo li[data-number = "1&#
浏览 0提问于2016-07-03得票数 1
回答已采纳
来文提交人：
<ul class="supercategory">
<li>
<div class="supcat">
<h4>
<a class="new" href="/header1.html">header 1</a>
</h4>
<ul class="category">
<li><a hr
浏览 3提问于2012-09-13得票数 2
回答已采纳
我希望列表元素的值是排序事件期间排序位置的索引。
该值应在排序更改事件期间自动更新。
<script type="text/javascript">
$(function() {
$('#sortable').sortable({
start : function(event, ui) {
var start_pos = ui.item.index();
ui.item.data(&#
浏览 3提问于2013-04-18得票数 4
回答已采纳
1回答
我正在尝试学习jQueryUI可排序功能，以便使它在我的网页上使用的响应表上工作。
我制作了一个来进行一些测试，但是我不知道如何拖放列(不仅仅是th的)。
我怀疑我应该使用"connectWith“(还是"items"?)选项，并连接所有与拖放的td共享相同id的td，但我没有成功地做到这一点。
我甚至不确定"connectWith“或"items”实际上是为了什么，但我在文档中找不到任何其他东西，它们似乎可以帮助我实现列拖放。
HTML：
<html>
<body>
<table>
浏览 1提问于2019-02-10得票数 0
1回答
下面的代码允许拖放列表项：
<%@ Page Language="C#" AutoEventWireup="false" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
浏览 0提问于2015-01-09得票数 1
回答已采纳
我使用的是jQuery-UI可排序连接列表。我将连接列表的顺序保存到Rails服务器。
我的方法是获取每个列表项的列表ID、列ID和索引位置。然后，我想将其封装到一个对象中，该对象可以作为参数传递回Rails控制器，以保存到数据库中。因此，理想情况下，我希望将参数设置为如下格式：Parameters: {"Activity"=>[{id:1,column:2,position:1},{id:2,column:2,position:2} ,...]}
如何正确格式化要在此Ajax POST请求中传递的参数？现在，通过下面的方法，我将传递Parameters: {"u
浏览 1提问于2012-11-04得票数 0
回答已采纳
我有一个媒体展览馆。出于某种奇怪的原因，设计师决定将这些媒体项目放在12个块中。三行，每行四个项目，然后有一个间隙。
现在，我不想在每个块的父列表中放置一个包含12个项目的列表。我认为这可以很容易地通过jQuery过滤来处理，每隔三行添加一个类。
我知道如何确定列表中每四个:nth(4)项的目标，但是如何确定第三行中的每一项呢？
对于这样的事情，我可以使用什么过滤器？
标记如下所示。所有项都是无序列表中的浮动元素。
<ul>
<li><img src="#"></li>
<li><img src=
浏览 1提问于2011-07-24得票数 1
回答已采纳
2回答
我有一种特殊的情况。我有两份名单。1个列表包含所有项目，2个列表包含顶部列表。显然，项目重叠，第二个列表中的项目被标记为类克隆-23克隆-25，根据它们从列表1中克隆的元素。
Example:
List 1
1 run
2 eat
3 drink
4 play
List 2 (TOP)
1 run (class clone)
2 eat (class clone)
当重新排列的数据被保存到DB时。
我想避免刷新和重新提取数据从DB。所以我想同步元素在两个列表中的位置。因此，每当用户拖动列表1中的项时，列表2会自动显示更改的位置，反之亦然。
我开始我的分类：
// Initiate jquer
浏览 5提问于2013-11-28得票数 2
回答已采纳
我使用以下代码在我的网站上重新排序项目：
$(document).ready(function () {
$("#my-list").sortable({
stop: function (event, ui) {
var id = $(ui.item).attr('id');
var url = '/en/account/changeposition?id=idreplace&position=posReplace';
url = url.
浏览 0提问于2013-06-03得票数 8
回答已采纳
1回答
如何向匿名函数中“注入”变量
、、、、
我有以下jQuery (ui)代码：
function initSortable() {
var placeholderClass = "ui-state-highlight";
var movement; /* = {'id': 0, 'from': 0, 'to': 0};*/
setPlaceholderClassHeight(placeholderClass);
$(".listTable td").each(function () {
$(this)
浏览 3提问于2015-04-17得票数 0
回答已采纳
我正在使用jQuery UI可排序插件，我正在尝试接收两个警报
我想要元素的起始位置和元素的结束位置。
$(function() {
$("#filterlist ul").sortable({ opacity: 0.6, cursor: 'move', update: function(event, ui) {
alert(ui.item.prevAll().length + 1);
}
});
});
我可以在拖拽项目后获得它的位置，使用：-
ui.item.prevAll().length + 1
我
浏览 2提问于2010-04-12得票数 5
回答已采纳
1回答
我有两个<ol>列表，第一个可以使用jquery方法排序，另一个是固定的。
我想要的是，强迫第二层，得到与第一层中相应的li相同的顺序。因此，在我的示例中，如果我将OL-1 LI n.1与OL-1 LI n.2交换，则OL-2 LI n.1也将与OL-2 LI n.2交换。
可能解决方案必须封装在可排序的“停止”事件中，这就是我在示例中包含它的原因。
想不出办法。
$('#sortable').sortable({
revert : true,
delay: 150,
stop : function(event,ui){
浏览 2提问于2021-04-15得票数 0
回答已采纳
我试图在每个成员中的最后一项下显示一段标记--我尝试过类似于@ came -但是它回来了一个错误。
<ul>
{{#each people as |person index|}}
<li>Hello, {{person.name}}! You're number {{index}} in line</li>
{{/each}}
</ul>
浏览 0提问于2018-09-24得票数 1
回答已采纳
根据这个问题(和答案)，我应该能够从以下几个方面得到最初的开始位置和结束位置：
$('#sortable').sortable({
start: function(e, ui) {
// creates a temporary attribute on the element with the old index
$(this).attr('data-previndex', ui.item.index());
},
update: function(e, ui) {
// gets the
浏览 2提问于2014-10-24得票数 0
回答已采纳
我想知道实现JQuery排序和拖放的推荐方式是什么。我想我可以使用update事件来更新模型：
var options = {
placeholder: "ui-state-highlight",
update: function (event, ui) {
// update the model
} ,
$("#sortable").sortable(options);
但这将重新触发dom的更新。那么Ember插入的特殊脚本标记又如何呢？
我想要实现的内容可以在这里看到：
问候罗杰
浏览 3提问于2012-07-29得票数 2
假设我们有一个名为“slide_down_div”的div，其中包含两个ul(列表)。我想做以下选择：
$('#slide_down_div ul:eq(0)');和第二个..。
$('#slide_down_div ul:eq(1)');，我需要你在这个问题上的帮助
现在，在第二个陈述中，我想进一步选择第一和第五里(列表项目)，以适用于他们的风格。有办法吗？请建议一下。
此外，请告诉我是否可以将上述两个jquery语句合并为一个。
<ul>
<li><img src='images/WindowsL
浏览 4提问于2012-08-11得票数 0
回答已采纳
你能告诉我怎么把所有的李都藏起来吗？在第二种情况下，我想隐藏所有的li期望显示3和4的按钮，点击这里是我的代码
$(function() {
$('#id_show12').click(function() {
$('.show12').not(":nth-child(2)").css("display", "none");
})
$('#id_show34').click(function() {
$('.show34').not(":nt
浏览 0提问于2017-07-05得票数 3
回答已采纳
1回答
我试图制作一个简单的显示隐藏示例，但我无法使用eq()或not()选择隐藏元素。基本结构如下：
<ul id="info">
<li><a href="#">İletişim Adreslerimiz</a></li>
<li><a href="#">Kroki</a></li>
</ul>
<ul id="info-ic">
<li><p>Adres Bilg
浏览 0提问于2010-03-01得票数 2
如何使用jQuery从特定/选定元素中选择第n个相邻元素？
在下面的示例中，如何从选定的/特定元素( <li><a href="#">this is the 2nd adjacent element from active</a></li>)中选择第二个相邻元素(<li class="active" ><a href="#">this is the current active element</a></li>)。
请注意:我不能使用eq()或nth-
浏览 2提问于2017-11-02得票数 0
回答已采纳
<li><a target="_blank" href="#">test one</li>
<li><a target="_blank" href="#">test one</li>
<li><a target="_blank" href="#">test one</li>
<li><a target="_blank" href="#">
浏览 0提问于2011-07-20得票数 0
回答已采纳
我正在尝试用aurelia实现jquery-ui的可排序列表功能。用dom中的新订单更新项目(在aurelia控制器中)的最好方法是什么？"ref“是这里的一种方法吗？很容易对dom中的列表项进行重新排序，但是如何将更改应用到aurelia-list-object？
<ul class="sortable">
<li repeat.for="item of items">
Stuff.
</li>
</ul>
一种方法是将$index附加到li-item，在顺序更改后使
浏览 0提问于2016-09-13得票数 0
我正在使用setInterval()方法尝试对每个单独的li应用一个类。
我已经创建了一个应用toggleClass的jsFiddle，但是我不能让它逐个应用这个类。
下面是我的javaScript，我还添加了一个指向jsFiddle的链接：
var i = 1;
var id = setInterval(function () {
$("ul").children(i).toggleClass('test');
i++;
if (i === 4) {
i = 1;
}
}, 1000);
浏览 2提问于2013-08-29得票数 1
1回答
我使用的是jquery可排序的排列图像，我想要做的就是更改获取图像的隐藏id和新的当前位置号，这样我就可以运行ajax请求来更新数据库中的新位置，但是当我更改图像位置时，警报不会被触发(在下面的代码中)，所以我想知道我做错了什么。
Jquery代码
<script>
$(function() {
$("#sortable").sortable({
stop: function(event, ui) {
$('input.imageHiddenIm
浏览 3提问于2015-05-06得票数 0
回答已采纳
2回答
我有一个包装在div标记中的项目列表
<div id="contentleft">
<ul>
<li><a href="http://www.google.com">Google<a/></li> //1
<li><a href="http://www.cnn.com">CNN<a/></li> //2
<li><a href="http://www.ign.com">IGN<a/&
浏览 2提问于2013-02-23得票数 1
2回答
我正在用jQuery创建一个非常简单的测验应用程序。它是如何工作的，你有一个问题和三个答案。点击错误的答案会使点击答案的不透明度降低到60%。点击正确答案应该会使所有错误答案完全淡出，只剩下正确答案。
该页面有3个测验，可通过导航选择。因此，我正在使用.index()对测试和问题进行排序，以针对手头的特定问题。它和测验的其他元素一样工作得很好。
我遇到的唯一问题是让其他答案在选择正确答案时逐渐淡出。现在，只有第一个问题是这样运作的；所有其他问题仍然是100%不透明的。我已经盯着它看了一整晚了，试图让它走，我可以多看一眼。
代码：
$('#test .test li ol li'
浏览 0提问于2012-02-10得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
腾讯会议活动推荐
腾讯云开发者
