0

我正在尝试做这样的事情:

假设在页面加载之前,页面的结构是这样的:

<div class="maindiv">
<div><a href="www.google.com" class="divlink">div1</a></div>
<div><a href="www.google.com" class="divlink">div2</a></div>
<div><a href="www.google.com" class="divlink">div3</a></div>
<a class="showmore" onclick="somefunctiontoloadmoreitems()">showmore</a>
</div>

现在我正在使用 jQuery 并覆盖这样href的链接

$('document').ready(function(){
    $('.divlink').attr('href','www.facebook.com');
});

所以加载之后,页面会是这样的。

<div class="maindiv">
<div><a href="www.facebook.com" class="divlink">div1</a></div>
<div><a href="www.facebook.com" class="divlink">div2</a></div>
<div><a href="www.facebook.com" class="divlink">div3</a></div>
<a class="showmore" onclick="somefunctiontoloadmoreitems()">showmore</a>
</div>

到现在还可以。

现在,当有人单击 showmore 链接时,接下来的三个项目将附加到 maindiv。div此链接将被删除,并且在所有六个s之后将创建一个新的 showmore 链接。现在整个页面是这样的:

<div class="maindiv">
<div><a href="www.facebook.com" class="divlink">div1</a></div>
<div><a href="www.facebook.com" class="divlink">div2</a></div>
<div><a href="www.facebook.com" class="divlink">div3</a></div>
<div><a href="www.google.com" class="divlink">div1</a></div>
<div><a href="www.google.com" class="divlink">div2</a></div>
<div><a href="www.google.com" class="divlink">div3</a></div>
<a class="showmore" onclick="somefunctiontoloadmoreitems()">showmore</a>
</div>

所有这些功能都是标准的,这意味着我无能为力。我只能编写一些 jQuery 代码来覆盖href链接。由于我onready对文档的 jQuery 事件,href只有前三个元素中的 将被覆盖。但我也想覆盖href在单击 showmore 按钮时将生成的所有链接。

有没有办法做到这一点?

(这只是我向您解释的一种情况。我还想更改更多CSS。有没有一种方法可以更改所有内容?)

4

2 回答 2

2

把它写在其他函数中

function somefunctiontoloadmoreitems()
{
  $('.divlink').attr('href','www.facebook.com');
}

告诉你是否想要这个?我不知道。

function appendvalues(href, classname)
{
   var maindiv = document.getElementById("maindiv").childNodes;
   for(var i=0; i<maindiv.length; i++)
   {
      maindiv[i].setAttribute("href",href);
      maindiv[i].setAttribute("class",classname);
   }

}

尝试在您的代码中实现这一点。

于 2013-08-11T11:16:52.977 回答
1

根据您的要求进行编辑,现在在单击“显示更多”链接后每秒运行 10 秒。

一个更“优雅”的解决方案是在添加新元素时停止间隔,方法是比较每次循环运行时集合中元素的计数。

var modify_links_cycle = 0;
var modify_links_interval = null;

$('.maindiv').on('click', '.showmore', function() {
  clearInterval(modify_links_interval);
  modify_links_interval = setInterval(function() {
    // your modifications to the links
    $('.maindiv .divlink').attr('href', 'http://www.facebook.com');
    // /end
    modify_links_cycle++;
    if (modify_links_cycle === 9) {
      clearInterval(modify_links_interval);
    }
  }, 1000);
});
于 2013-08-11T11:17:01.923 回答