0

我有一个我正在尝试为网站主机编写的代码，一位成员要求提供一些支持。我写了这个，它只适用于文本，但使用 href 会破坏标记。

http://jsbin.com/izebej/1/edit

代码：

  $.getScript("http://xoxco.com/projects/code/rainbow/rainbow.js",function() {
      var selectMe= ["u1","u2"];
   for(var i =0;i<selectMe.length;i++){
     $('.username').find('a[href*='+selectMe[i]+']').addClass('selected');
    }
   $('.selected').text(function() {
        $(this).rainbow({
    colors: [
      '#FF0000',
      '#f26522',
      '#fff200',
      '#00a651',
      '#28abe2',
      '#2e3192',
      '#6868ff'
     ],
      animate:true,
      animateInterval:100,
      pad:false,
      pauseLength:100
       });
     });
   });

标记在 JSBIN 中——您可以清楚地看到发生了什么。我尝试了很多不同的方法。此外，如果您查看标记，我清楚地将最后一个的 href 标记为 u21，将其视为我写 u1 和 u2 的对象。将它们结合起来，看看它是否只是在寻找任何有 1 或 2 的东西。在你看到的 for 循环中，a[href*='+selectMe[i]+'我已经将其更改a[href='selectMe[i]'为以及a[href="'+selectMe[i]+'"那些不起作用。

有什么建议么？

4

1 回答 1

1

@EasyBB 我试图看到它，但没有看到彩虹效果我可以在任何地方看到它......

如果您的意思是，在 Rainbow 中不应该看到 strong ......但只有 span 内的文本......那么它就是插件的工作方式。

如果你看到插件代码...

if (chars[x]!=' ') {
     newstr = newstr + '<span style="color: ' + options.colors[counter] + ';">' + chars[x] + '</span>';
     counter++;
} else {
    newstr = newstr + ' ';

}

他们所做的是打破元素的 HTML 内容并通过将其添加到 SPAN 中来为其应用颜色......

所以<span> TEST </span>变成<span color="x"> < </span><span color="x"> S </span>等等，所以它不会保留为 HTML 标记，而是简单的文本......

我认为您最好的选择是找到作为文本直接父母的元素，例如

演示

$.getScript("http://xoxco.com/projects/code/rainbow/rainbow.js",function() {
var selectMe= ["u1","u2"];
for(var i =0;i<selectMe.length;i++){
$('.username').find('a[href*="'+selectMe[i]+'"]').addClass('selected');
}
  $('.selected').find('*').andSelf().contents().filter(function(){
   return this.nodeType===3;
  }).parent().text(function() {
    $(this).rainbow({
  colors: [
  '#FF0000',
  '#f26522',
  '#fff200',
  '#00a651',
  '#28abe2',
  '#2e3192',
  '#6868ff'
  ],
animate:true,
animateInterval:100,
pad:false,
pauseLength:100
});
});
});
于 2013-05-19T16:00:36.947 回答