突出变化？

HTML：突出变化？

<html> 
<body> 
    <textarea>Original Text</textarea> 
    <button>Replace</button> 
</body> 
</html>

的jQuery：

$(function() { 
$('button').click(function() { 
    $('body').html($('body').html().replace('Original','New')); 
}); 
});

http://jsfiddle.net/r7MgY/

我可以用一个衰落的黄色背景也许突出的变化不知何故？

来源

2010-05-19 3zzy

正如Sarfraz所说，使用jQuery颜色插件。用法与jQuery中的动画方法相同。该插件将覆盖这些属性的动画方法：'backgroundColor'，'borderBottomColor'，'borderLeftColor'，'borderRightColor'，'borderTopColor'，'颜色'，'outlineColor'。

jQuery的动画的方法使用和信息可以在这里找到：http://api.jquery.com/animate/

另外，如果你想这是更好地获取标签的包装标签上的HTML来代替的东西，包含要调用的替代方法是什么而不是通过整个身体作为一个字符串进行搜索。通常你会使用：

$('#idOfMyWrapperTag').html().replace('this', 'that')

但由于您使用的是textarea的，你可以得到它的值与此：

$('textarea').val().replace('this', 'that');

..fredrik

来源

2010-05-19 07:55:13 fredrik

+1指出，它是更好的使用选择器比作为一个字符串搜索身体 – 2010-05-19 08:04:18

我可以用某种方式突出变化：淡黄色背景可能吗？

你将不得不使用jquery color plugin褪色的背景颜色。

来源

2010-05-19 07:43:48 Sarfraz

谢谢，但没有可用的插件文档。 :( – 3zzy 2010-05-19 08:28:40

@Nimbuz：对不起，但看到这个：http://plugins.jquery.com/project/color – Sarfraz 2010-05-19 08:30:38

因为它的textarea，你不能直接注入任何HTML到内容中。你将不得不叠加一个绝对定位的元素，其中包含一个红色的波形或类似的东西 - 这在编制文本的确切位置时会变成一场噩梦。

如果可能的话，沟渠textarea，只是使用可编辑的div或类似。

来源

2010-05-19 07:53:29

您也许能要解决它

$(function() { 
    $('button').click(function() { 
    $('body').html($('body').html().replace(/Original/g,'<span class="fade" style="opacity: 0; background-color: yellow;">New</span>')); 
    $('.fade').animate({ 
     'opacity': 1 
    }, 1000, function(){ 
     $(this).contents().unwrap(); 
    }); 
    }); 
});

来源

2010-05-19 07:56:08 jAndy

只有一件事要保持记住这是跨度内的文本也会消失。 – fredrik 2010-05-19 08:00:26

如果你不想包含另一个插件，你可以简单地用一个小的jQuery代码ACCOM plish衰落覆盖：

jQuery.fn.highlight = function() { 
    $(this).each(function() { 
     var el = $(this); 
     el.before("<div/>") 
     el.prev() 
      .width(el.width()) 
      .height(el.height()) 
      .css({ 
       "position": "absolute", 
       "background-color": "#ffff99", 
       "opacity": ".9" 
      }) 
      .fadeOut(500); 
    }); 
} 

$("#target").highlight();

幸得这样的回答：https://stackoverflow.com/a/11589350/1145177

来源

2012-10-15 05:40:21

回答

相关问题