突出变化?
HTML:
jQuery的:
$(function() { $('button').click(function () { $('body').html($('body').html().replace('Original','New')); }); });
http://jsfiddle.net/r7MgY/
我可以用渐弱的黄色背景突出显示变化吗?
正如Sarfraz所说,使用jQuery颜色插件。 用法与jQuery中的animate方法相同。 该插件会覆盖这些属性的动画方法:’backgroundColor’,’borderBottomColor’,’borderLeftColor’,’borderRightColor’,’borderTopColor’,’color’,’outlineColor’。
jQuery animate方法的用法和信息可以在这里找到: http : //api.jquery.com/animate/
此外,如果您想要替换HTML中的内容,最好获取包含您想要调用替换方法的标记的包装标记,而不是以字符串forms搜索整个主体。 通常你会使用:
$('#idOfMyWrapperTag').html().replace('this', 'that')
但是既然你正在使用textarea,你可以用它来获得它的价值:
$('textarea').val().replace('this', 'that');
..fredrik
因为它是textarea,你不能直接将任何html注入到内容中。 你必须覆盖一个包含红色波浪线或类似物的绝对定位元素 – 当计算出文本的确切位置时,这会变成一场噩梦。
如果可能的话,抛弃textarea并使用可编辑的div或类似物。
我可以用渐弱的黄色背景突出显示变化吗?
您必须使用jquery颜色插件来淡化背景颜色。
您可以使用它来解决它
$(function() { $('button').click(function () { $('body').html($('body').html().replace(/Original/g,'New')); $('.fade').animate({ 'opacity': 1 }, 1000, function(){ $(this).contents().unwrap(); }); }); });
如果您不想包含另一个插件,可以使用一些jQuery代码来完成淡入淡出的叠加:
jQuery.fn.highlight = function() { $(this).each(function() { var el = $(this); el.before("") 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