Question

我有一个可能包含多个逗号分隔值的变量。我想在无序列表中拆分并动态显示lis。

当点击每个li时，我需要抓取li中的文本以在稍后的函数中使用。我试图在下面这样做不成功。

点击后，请帮助我获取每个li的文字。

 function viewUploadedFiles() {
 var fpath = $("#filePathList").val();
 var fnameVal = $("#fileNameList").val();
 var display = displayFiles(fnameVal);
 $("#upload_FileList").html(display);
}

function displayFiles(fname) {
  var septor = ',';
  var selected="<ul class='file_List' >";
     if (fname.indexOf(septor) >= 0) {
         var fnameArray = fname.split(septor);
         $.each(fnameArray, function(index,value) {
             alert(index+" Files ===> "+value);
                selected+='<li class="file_list_line" id="file_ID"><span class="text">'+value+'</span><input type="button" value="Delete File" onclick="deleteFile()"></li>';
         });

     } else {
         selected+='<li class="file_list_line" id="file_ID"><span class="text">'+fname+'</span><input type="button" value="Delete File" onclick="deleteFile()"></li>';
     }
     selected+='</ul>';
    return selected;
}

function deleteFile(){
alert($(this).text());
}

<div id="upload_FileList" align="left">
</div>

Answer 1

我对用于使其在jsfiddle上运行的脚本做了一些小改动。您遇到的问题是单击按钮时deleteFile（）函数不可用。删除内联函数调用并使用带有jquery的委派来注册调用可以解决您的问题。

假设您将生成的html标记放在列表中，则需要将其添加到脚本中。

$('#upload_FileList').on('click', 'li', function(){
    $(this).css('color', 'red');
    console.log($(this).text())
});

只要点击upload_filelist UL内的LI，就会触发该函数。

这里是功能小提琴 - http://jsfiddle.net/t99sm54q/1/

如何在jquery中获取动态添加的ul的文本

1 个答案: