從動態元素列表中獲取選擇器事件索引

我想知道是否有人可以提供有關如何解決獲取事件索引問題的信息。我懷疑封鎖可能是解決方案的一部分，但會感謝一些見解。從動態元素列表中獲取選擇器事件索引

首先我動態構建HTML5視頻容器，例如該建立與調用PHP腳本，通過循環，並建立這個取決於我有多少視頻要在彈出模態的AJAX程序：

<div id="ids_<?php echo $i+1;?>" > 
     <h5><?php echo $route_title;?></h5> 
     <video id ="myPlayer_<?php echo $i+1;?>" 
      width="100%" poster="videos/posters/<?php echo $poster_name;?>" 
      controls data-info ='<?php echo $jsonData;?>' > 
      <source src="videos/<?php echo $video_name;?>" type="video/mp4"> 
      Your browser does not support HTML5 video. 
     </video> 
    </div>

您可以看到關鍵元素是視頻id=myPlayer_1, myPlayer_2 etc。我現在使用下面的代碼片段創建包含所有視頻元素的模式框。（'data_val[0]'擁有上面顯示的php生成的代碼）。

$(".modal-boxes").append('<div id="dialog_1" title="Most popular videos">'+data_val[0]+'</div>'); 
    var numItems = $('.modal-boxes').length; 
    var hsize = numItems*320; 
    if (hsize > 600) hsize = 600; 
    $("#dialog_1").dialog({ width: 250, height: hsize, dialogClass: 'no-  close video-dialog'}); 
    var popUpPlayer =[]; 
    for (var i= 1; i <= numItems; i++){ 
     popUpPlayer[i] = document.getElementById("myPlayer_"+ i); 
    }

在HTML模式盒被聲明爲：

<div class="modal-boxes"> </div>

，我現在可以通過以下方式使用這些對象。裏面的代碼很常見，但不需要。例如：

popUpPlayer[index].onplay = function() { 
     'do something in here once the user clicks the play button' 
    }

現在我的問題是如何知道的JavaScript應用何種索引時，用戶點擊第三個說視頻，這可能是指數= 3？

我希望這是有道理的。

感謝

來源

2016-12-01 TrueBlue

請將PHP更改爲HTML並使用「<>」片段編輯器 – mplungjan

在這裏你有一個演示，所以你可以看到每個函數知道哪些指標有其自身

通知的第一個例子保留了預期指標，而反例獲取最後的i1值這是7

var numItems = 6; 
 
var popUpPlayer = []; 
 

 
//// callbacks know what was their index at the time the closure took place //// 
 

 
for (var i3 = 1; i3 <= numItems; i3++) { 
 
    popUpPlayer[i3] = {}; // dummy object to mimic 
 
    popUpPlayer[i3].onplay = myNewCallback(i3); 
 
} 
 

 
function myNewCallback(index) { 
 
    return function() { 
 
    console.log('callback says: ' + index); 
 
    }; 
 
} 
 

 
for (var i4 = 1; i4 <= numItems; i4++) { 
 
    popUpPlayer[i4].onplay(); 
 
} 
 

 
//// counter-example below, will always print 7 //// 
 

 
for (var i1 = 1; i1 <= numItems; i1++) { 
 
    popUpPlayer[i1] = {}; // dummy object to mimic 
 
    popUpPlayer[i1].onplay = function() { 
 
    console.log('onplay says: ' + i1); 
 
    }; 
 
} 
 

 
for (var i2 = 1; i2 <= numItems; i2++) { 
 
    popUpPlayer[i2].onplay(); 
 
}

來源

2016-12-01 13:59:25 arhak

Thankyou創建[mcve]。這是一個非常聰明的解決方案。我現在正在實施它，並且一旦證明會接受。 – TrueBlue

我實現了你給出的第一個例子，它完美地工作。謝謝。 – TrueBlue

從動態元素列表中獲取選擇器事件索引

回答

相關問題