javascript - 使用.on()时传递值

addOnClickToPathContents（）函数用于将onclick事件添加到一些动态创建的li标签中，这样，当单击li标签时，它将调用pathBuilder（）函数。 pathBuilder（）函数需要一个参数。有没有一种方法可以将fileList[f]作为.on（）代码行的一部分传递给pathBuilder？如果是这样，怎么办？

function addOnClickToPathContents(fileList)
{
	for(var f in fileList)
	{
		$('#' + fileList[f]).on('click', pathBuilder);
	}
}

function pathBuilder(file)
{
	console.log(file);
  //once this works, use file in logic within this function
}

最佳答案

是的，您可以在父元素上使用事件委托。假设您有fileList对象，其中包含文件的所有数据。键是列表元素的ID，在这种情况下，您甚至不需要循环，只需单击对象时从列表ID中选择一个值即可。
把事情简单化 ;）

(function($){

  var fileList = {
    file1: {data: {url: '/file1'}},
    file2: {data: {url: '/file2'}},
    file3: {data: {url: '/file3'}},
    file4: {data: {url: '/file4'}}
  }

  var fileBuilder = function(file){
    console.log(file);
  }

  $(function(){

    $('#fileList').on('click', '.file', function(){
      var file = fileList[this.id];
      fileBuilder(file);
    });



  });
})(jQuery)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul id="fileList">
  <li class="file" id="file1">File 1</li>
  <li class="file" id="file2">File 2</li>
  <li class="file" id="file3">File 3</li>
  <li class="file" id="file4">File 4</li>
</ul>