jQuery显示动态加载的div

时间:2019-01-09 08:32:07

标签: jquery dom

我有一堆DIVS,它们是通过jquery AJAX调用动态加载的。 DIVS都有一个锚,该锚具有.more_info类和一个id-info-xxx(其中xxx是产品ID)的ID。单击链接后,我想显示一个ID为infoxxx的隐藏div。

我的代码:

CREATE OR REPLACE Procedure NML.AddProductProcedure(
    V_CRD_COD In varchar2,
    V_ITM_COD In varchar2,
    V_SRL_NUM In varchar2,
    V_UOM_ABR IN varchar2,
    V_QTD_RTE IN varchar2,
    V_QTY_PRC In varchar2,
    V_QTN_NUM IN varchar2,
    V_PMT_FLG IN varchar2,
    V_TAX_FLG IN varchar2,
    V_DLV_FLG IN varchar2,
    p_updated_flag out pls_integer                                           
    )IS
 BEGIN

   Update NML.pgi_00_13 
   set 
       UOM_ABR=V_UOM_ABR,
       QTD_RTE=V_QTD_RTE,
       QTY_PRC=V_QTY_PRC,
       QTN_NUM=V_QTN_NUM,
       PMT_FLG=V_PMT_FLG,
       TAX_FLG=V_TAX_FLG,
       DLV_FLG=V_DLV_FLG
   Where CRD_COD=V_CRD_COD 
   AND ITM_COD=V_ITM_COD 
   AND SRL_NUM=V_SRL_NUM;   

   if sql%rowcount > 0 then
       p_update_flag := 1;
   else
       p_update_flag := 0;
   end if;

 END;

,但不显示div(infoxxx)。我猜测还有另一种方法可以访问该div,因为它是动态加载的?

2 个答案:

答案 0 :(得分:0)

根据提供的详细信息,由($(this).attr('id'))产生的交易编号将采用info-xxx的形式,因此当您尝试

$("#info"+dealid).show(1000);

就像

$("#infoinfo-xxx").show(1000);

因此,通过替换信息文本来获取正确的ID

$(document.body).on('click', '.more_info' ,function(){
    var dealid = ($(this).attr('id')).replace("info-",""); 

    $("#info"+dealid).show(1000);  

  });

答案 1 :(得分:0)

我不知道我是否正确地获得了HTML,但是主要思想是:

var prodID = dealID.split('-').pop();

dealID是模式info-xxx

在连字符处使用split('-'),最后以2个元素组成的数组['info', xxxx]

然后将pop()链接到split()方法,并在返回时获得xxxx


演示

$(document.body).on('click', '.more_info', function() {
  var dealID = ($(this).attr('id'));

  var prodID = dealID.split('-').pop();

  $("#info" + prodID).show(1000);

});
.more_info::after {
  content: attr(class)
}
<div>
  <a href='#/' id='info-1234' class='more_info'></a>
</div>
<input id='info1234' hidden>

<div>
  <a href='#/' id='info-1359' class='more_info'></a>
</div>
<input id='info1359' hidden>

<div>
  <a href='#/' id='info-6911' class='more_info'></a>
</div>
<input id='info6911' hidden>

<div>
  <a href='#/' id='info-5227' class='more_info'></a>
</div>
<input id='info5227' hidden>




<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>