在javascript中获取动态类元素

Question

我有一个带有一堆tr元素的表,其中包含随机的,动态创建的id,以及具有匹配id的相应div.我想使用on('click')函数,这样当单击一个具有给定id的tr元素时,也会通过javascript单击相应的div id.

桌子:

<tbody>
    <tr id="a94k5h3"></tr>
    <tr id="0f3l6k2"></tr>
    <tr id="44jg96a"></tr>
</tbody>

div:

<div id="a94k5h3"></div>
<div id="0f3l6k2"></div>
<div id="44jg96a"></div>

我到目前为止的代码:

    $(document).on('click', '#view_347 #a94k5h3', function(event) { 
    event.preventDefault(); 
    $("#view_349 .kn-view.kn-map-results.view_349 #a94k5h3").click(); 
});

上面的代码适用于第一个,但实际上我不知道id#a94k5h3是什么,或者有多少tr/div.任何帮助将非常感激!

-编辑

我正在使用knack,它动态创建所有的html元素,它不是我的代码.我附上了输出图像,以便进行澄清.[![在此输入图片说明] [1]] [1]

基本上我在页面上有两次相同的html元素.点击一个,我也希望点击另一个.

Answer 1

由于您不能在单个页面上拥有重复的ID,我建议您使用如下data-*属性:

<tr data-id="#a94k5h3">

并用于.trigger("click")触发 元素click上的指定事件DIV

例:

$(document).on('click', '[data-id]', function(event) {

  event.preventDefault(); // not sure you need this...

  // ID is unique! remember? you don't need the classes extra selectors
  // Use trigger "click"
  $($(this).data("id")).trigger("click");
});


// Just to test!:
$("#view_349").find("div").on("click", function() {
   console.log( this.id );
});

<table>
  <tbody>
    <tr data-id="#a94k5h3"><td>a94k5h3 CLICK ME</td></tr>
    <tr data-id="#0f3l6k2"><td>0f3l6k2 CLICK ME</td></tr>
    <tr data-id="#44jg96a"><td>44jg96a CLICK ME</td></tr>
  </tbody>
</table>


<div id="view_349">
  <div id="a94k5h3">DIV a94k5h3</div>
  <div id="0f3l6k2">DIV 0f3l6k2</div>
  <div id="44jg96a">DIV 44jg96a</div>
</div>

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