jQuery查找跨度样式颜色以替换为颜色哈希 [英] JQuery find span style color to replace with color hash

问题描述

我正在使用我的jquery脚本来查找具有颜色和想要用#444444替换的rgb的样式.我在查找样式颜色时遇到了问题，因为当我尝试这样做时:

I am working on my jquery script to find the style with the color and the rgb that I want to find to replace it with #444444. I have got a problem with find the style color because when I try this:

$('#text_editor').find('[style*="color: rgb(68, 68, 68)]"').css('color', '#444444');

它不会让我用颜色和rgb查找样式，因为它不会替换它.

It wont let me to find the style with the color and rgb as it wont replace it.

我也尝试过这个:

$('#text_editor').find('color: rgb(68, 68, 68)').css('color', '#444444');

这:

document.execCommand('foreColor', false, '#444444');
$('#text_editor').find("span[style*='color: rgb(68, 68, 68)']").css('color', '#444444');

这并没有什么不同，因为我不断得到这个:

It make no different as I am keep getting this:

<span style="color: rgb(68, 68, 68);">sdgsdgsdgsdgsdg</span>

这是我想要实现的目标:

Here is what I want to achieve:

<span style="color: #444444;">sdgsdgsdgsdgsdg</span>

这是html:

<div id="text_editor" class="editor_message" hidefocus="false" aria-label="Message Body" g_editable="true" role="textbox" aria-hidden="true" aria-multiline="true" contenteditable="true" tabindex="1" style="direction: ltr; height: 500px; width: 100%; padding-left: 25px; padding-top: 18px; font-size: 16px; border-bottom: 1px solid #d1d1d1; border-right: 1px solid #d1d1d1; border-left: 1px solid #d1d1d1; overflow-y: auto;" itacorner="6,7:1,1,0,0">
    <span style="color: rgb(68, 68, 68);">sdgsdgsdgsdgsdg</span>
</div>

这是完整的代码:

$(document).on('click', '#color-picker1', function(e) {

    $('#color-picker' + colorpicker_number + ' div').removeClass('tick-color');
    $('#color-picker' + colorpicker_number).removeClass('color-picker-border');
    $('#color-picker1 div').addClass('tick-color');
    $('#color-picker1').addClass('color-picker-border');
    colorpicker_number = 1;
    alert("time to change the color 6");
    document.execCommand('styleWithCSS', 0, true);
    document.execCommand('foreColor', false, '#444444');
    //$('#text_editor').find('[style*="color: rgb(68, 68, 68);"],color').css('color', '#444444');
    $('#text_editor').find('[style*="color: rgb(68, 68, 68)]"').css('color', '#444444');

    if ($('#toolbar_text_color').css('display') == 'block') {
        $('#toolbar_text_color').hide();
    }
    $('#text_editor').focus();
});

您能给我一个例子，让我找到如何用css替换为#444444之前想要找到的具有rgb颜色的样式吗?

Can you please show me an example how I can find the style with the rgb color that I want to find before I could use css to replace it with #444444?

谢谢.

推荐答案

您在.find()

$('#text_editor').find('[style*="color: rgb(68, 68, 68)]"') // Wrong
$('#text_editor').find('[style*="color: rgb(68, 68, 68)"]') // Right

---

但是，这不是您的主要问题.问题是colors计算值将使用它们的rgb或rgba值

---

However, this isn't your main issue. The problem is colors computed values are automatically displayed to you using their rgb or rgba value, as per the spec - So this is standard behavior that you can't really avoid, and those values are always going to be computed back to rgb or rgba

计算值::如果该值是半透明的，则计算值将是与之相对应的 rgba().如果不是，它将是对应的 rgb().透明关键字映射到 rgba(0,0,0,0)

Computed value: If the value is translucent, the computed value will be the rgba() corresponding one. If it isn't, it will be the rgb() corresponding one. The transparent keyword maps to rgba(0,0,0,0)

这篇关于jQuery查找跨度样式颜色以替换为颜色哈希的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！