Jquery - 如何将带有数字id的div追加到PHP生成div与具有相同数值的元素链接

时间:2014-03-28 15:09:12

标签: javascript jquery

我有一个问题是将具有不同数字id的元素追加到最接近div的元素(link),其数值与href相同?非常感谢你。

JSFiddle:example

我的Jquery尝试没有成功因为我被困住了:

$('.pagination').each(function(){
        var num_id = $(this).attr('id').match(/\d+/);
        if($('.ui-body h2 a').attr('href').indexOf(num_id) != -1){
            $('.ui-body h2 a').closest('<div>').append($(this));
        }    
});

HTML:

<div id="pagination65" class="pagination"></div> <!-- genereate by php function -->
<div id="pagination26" class="pagination"></div> <!-- same with different number at end -->

<div class="col-bottom-2">
  <div class="ui-body" style="background-color: #FCFCFC;"> <!-- This is div here I need append those div with same ID as href number in link below -->
    <h2 class="main" style="color: #236EE8;">
    <a class="ui-link" href="/cz/cs/65_chystane-akce.html" style="color: #236EE8;"> Chystané akce </a>
    <a class="small ui-link" href="/cz/cs/65_chystane-akce.html" style="color: #236EE8; float:right;"> >> </a>
    </h2>
  </div>
  <div class="ui-body" style="background-color: #F6F6FD;"></div>
  <div class="ui-body" style="background-color: #FCFCFC;"></div>
  <div class="ui-body" style="background-color: #F6F6FD;"></div>
</div>

2 个答案:

答案 0 :(得分:2)

您有1个错误和1个不完整的代码行。

您的错误位于JS的第4行。您缺少选择器上的简单或双引号:

$('.ui-body h2 a').closest('<div>').append($(this));

您的不完整代码来自match()部分。 match()返回它匹配的数组。由于您只有一个匹配(通过不定义g标志并且只有一个数字实例),您需要在此行上执行num_id[0]

if($('.ui-body h2 a').attr('href').indexOf(num_id[0]) != -1){

希望有所帮助。

您还可以通过以下方式简化流程:

$('.ui-body h2 a[href*=' + num_id[0] + ']').append($(this));

你做这件事的方式是有缺陷的,因为当你有一个来自选择器的多个结果并且你试图从那个选择中获得一个属性时,jQuery将专注于它首先发现的任何东西并忘记其余的。

完整的JS代码:

$('.pagination').each(function () {
    var num_id = $(this).attr('id').match(/\d+/);
    $('.ui-body h2 a[href*=' + num_id[0] + ']').append($(this));
});

答案 1 :(得分:1)

您的代码存在两个小问题 1.您的num_id返回了一个对象,因此我将其解析为int 2.您在if语句

中缺少查询选择器上的单引号
$('.pagination').each(function(){
  var num_id = $(this).attr('id').match(/\d+/);
  num_id = parseInt(num_id[0],10);
  if($('.ui-body h2 a').attr('href').indexOf(num_id) != -1){
    $('.ui-body h2 a').closest('div').append($(this));
  }    
});

在你添加小提琴之前看到这个,这里是我的jsbin http://jsbin.com/cajux/1/edit?html,js,output