时间戳

首页 > 解决方案 > 如何在 JavaScript 中为 HTML 元素使用动态 id？

javascript - 如何在 JavaScript 中为 HTML 元素使用动态 id？

问题描述

我正在尝试动态创建下拉框，在这里我可以动态创建下拉框，但在那之后，我需要从数据库中加载值，所以我需要做点击功能。在这里，我尝试使用动态 ID，但它无法解决这个问题。 

$( document ).ready(function() {
    
    $("#ssr").click(function(){
        
      alert("Test");    
    
      load_shift_code();
    });
  
  //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    for(var i=0;i<4;i++){
    var a=["html","css","java","javascript","php","c++","node.js","ASP","JSP","SQL"];
    var employee_name =emp_name();  
    var table_body = document.getElementById("table_head");
    var row = table_body.insertRow(0);
    var cell1 = row.insertCell(0);
    var cell2 = row.insertCell(1);
    var cell3 = row.insertCell(2)
    var cell4 = row.insertCell(3);
    var cell5 = row.insertCell(4);
    var cell6 = row.insertCell(5)
    var cell7 = row.insertCell(6);
    var cell8 = row.insertCell(7);
    var cell9 = row.insertCell(8);
    var cell10 = row.insertCell(9);
    var cell11 = row.insertCell(10);
    var cell12 = row.insertCell(11);
    
    var drop_down_list =document.getElementById("select");
  var idx="ssr";
    cell1.innerHTML = employee_name[i];
    cell2.innerHTML = employee_name[i];
    cell3.innerHTML = "<select  id='" + idx +"'><option value='default'>default</option></select>";
    cell4.innerHTML = "<select  id='select'><option value='default'>default</option></select>";
    cell5.innerHTML = "<select  id='select'><option value='default'>default</option></select>";
    cell6.innerHTML = "<select  id='select'><option value='default'>default</option></select>";
    cell7.innerHTML = "<select  id='select'><option value='default'>default</option></select>";
    cell8.innerHTML = "<select  id='select'><option value='default'>default</option></select>";
    cell9.innerHTML = "<select  id='select'><option value='default'>default</option></select>";
    cell10.innerHTML ="<select  id='select'><option value='default'>default</option></select>";
    cell11.innerHTML ="<select  id='select'><option value='default'>default</option></select>";
    
}
  
  
  
});

标签： javascripthtmldynamic

解决方案

将用于将事件侦听器添加到具有 id 的元素ssr 的代码放在创建元素并将其放入 DOM 的代码之后。如发布 $("#ssr")不会找到任何东西。

推荐阅读