jQuery的使用$。對事件處理

我見過的獲取元素的索引使用下面的代碼點擊的方式獲取點擊的元素的索引：

$('.element').mouseup(function() { 
    var index = $(this).index(); 
});

然而，由於以何種方式我的元素是動態生成的我一定要附上我的事件處理程序，像這樣：

$(document).on("mouseup", ".element", function(){ 
    //Do things 
});

由於$(this)將直接返回文件，我怎麼能找到該事件被觸發的元素的索引？

來源

2017-04-16 Adam0410

'$（'。element'）'返回一個元素數組，index是該數組的索引。在你的情況下，索引沒有意義。你想達到什麼目的？ – jdigital

觸發頁面上mouseup事件的類有多個元素。我需要索引，所以我以後可以使用'''$（「。element）.eq（n）'''，這樣我就可以將更改應用到觸發事件的特定元素。」 – Adam0410

這是怎麼回事？）'也返回元素？聽起來像你試圖做到這一點很難，如果元素是動態生成的，索引可能會改變，如 – jdigital

我實際上錯誤地在```$（document）.on（「mouseup」，「.element」，function（）{...}）範圍內調用$(this);確實會返回觸發此事件的元素。

這意味着我的問題毫無意義，但如果其他人有同樣的錯誤問題，我會將其留作歷史用途。

來源

2017-04-16 22:50:07 Adam0410

的元素，我會建議你放下問題。它沒有任何意義。更可能會混淆人。 – jdigital

一種方法是抓住家長，通過選擇孩子：

let index = $(this).parent().children();

然後，用它來抓取索引：

index.index(this);

所以把它包都在一起，雖然我不「知道爲什麼指數是與此有關..

$(document).on("mouseup", ".element", function(){ 
    let index = $(this).parent().children(); 
    index = index.index(this); 
});

這裏有一個可運行的版本供您

一種方法是抓住家長，通過選擇孩子：

let index = $(this).parent().children();

然後，用它來抓取索引：

index.index(this);

所以把它包都在一起，雖然我不「知道爲什麼指數是與此有關..

$(document).on("mouseup", ".element", function(){ 
 
    let index = $(this).parent().children(); 
 
    index = index.index(this); 
 
    console.log(index) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="element">test 0</div> 
 
<div class="element">test 1</div> 
 
<div class="element">test 2</div> 
 
<div class="element">test 3</div> 
 
<div class="element">test 4</div> 
 
<div class="element">test 5</div>

來源

2017-04-16 22:44:10

感謝您的很好的答案，但遺憾的是我錯了，在事件處理程序中使用$（this）實際上會返回觸發事件的元素。如果情況並非如此，那麼您的答案將不起作用，因爲您將嘗試檢索文檔的父級，這是不具任何影響的。 – Adam0410

它確實是，但不返回索引。我想我誤解了這個問題 –

不，它會返回'$（this）'的父母，這是你點擊 –

<body> 
    <ul class="element"> 
     <li >one</li> 
     <li >two</li> 
     <li >three</li> 
     <li >four</li> 
     <li >five</li> 
     <li >six</li> 
    </ul> 
    <script> 
     $(document).on("mouseup", ".element", function (e) { 
      //Do things 
      //var index = $(this).index(); 
      console.log($(e.target).index()); 
     }); 
    </script> 
</body>

對於這樣的html，你需要做的就是在回調中包含事件對象。如上所示，它在控制檯窗口上打印索引。

來源

2017-04-16 23:09:34

jQuery的使用$。對事件處理

回答

相關問題