如何从班级中删除角色？

Question

我想从 ol 中的每个 id 和每个类中删除 x_。该 ol 是从表单字段生成的，因此我无法访问它。

如果我将字段值保存在变量中，如何删除这些字符？

这是我的一些 jQuery

var itemValue = $("#ItemDescription").val();
console.log(itemValue);
$("body #demo ol.sortable").html(itemValue);

HTML (#itemDescription) 的内容

<li class="x_menu-item">
<div>Menu Item</div>
<ol>
    <li style="display: list-item;" class="x_no-nest" id="x_menu-item0">
    <div><a href="/_webapp_3915457/Portfolio1">Portfolio1</a></div>
    </li>
    <li style="display: list-item;" class="x_no-nest" id="x_menu-item1">
    <div><a href="/_webapp_3915468/Portfolio10">Portfolio10</a></div>
    </li>
    <li style="display: list-item;" class="x_menu-item">
    <div>Menu Item</div>
    <ol>
        <li style="display: list-item;" class="x_no-nest" id="x_menu-item3">
        <div><a href="/_webapp_3923732/Portfolio12">Portfolio12</a></div>
        </li>
    </ol>
    </li>
    <li style="display: list-item;" class="x_no-nest" id="x_menu-item2">
    <div><a href="/_webapp_3923731/Portfolio11">Portfolio11</a></div>
    </li>
</ol>
</li>
<li style="display: list-item;" class="x_no-nest" id="x_menu-item4">
<div><a href="/_webapp_3914327/Portfolio2">Portfolio2</a></div>
</li>
<li style="display: list-item;" class="x_no-nest" id="x_menu-item5">
<div><a href="/_webapp_3915633/Portfolio3">Portfolio3</a></div>
</li>
<li style="display: list-item;" class="x_no-nest" id="x_menu-item6">
<div><a href="/_webapp_3915649/Portfolio4">Portfolio4</a></div>
<ol>
</ol>
</li>
<li style="display: list-item;" class="x_no-nest" id="x_menu-item7">
<div><a href="/_webapp_3915635/Portfolio5">Portfolio5</a></div>
</li>
<li class="x_no-nest" id="x_menu-item8">
<div><a href="/_webapp_3915658/Portfolio6">Portfolio6</a></div>
</li>
<li class="x_no-nest" id="x_menu-item9">
<div><a href="/_webapp_3915650/Portfolio7">Portfolio7</a></div>
</li>
<li class="x_no-nest" id="x_menu-item10">
<div><a href="/_webapp_3915354/Portfolio8">Portfolio8</a></div>
</li>
<li class="x_no-nest" id="x_menu-item11">
<div><a href="/_webapp_3915356/Portfolio9">Portfolio9</a></div>
</li>

我也想在完成后将其替换为 textarea 值，但我可以自己做。我只需要帮助删除“x_”

谢谢！！ :)

Answer 1

您只需使用 attr 的回调函数即可从 ID 中删除所有“x_”：

$("#ItemDescription li").attr('id',function(i,e){
   if (typeof e != "undefined" && e.substring(0,2)=="x_") return e.substring(2);
});

例如： http://jsfiddle.net/niklasvh/Rfq2n/

如果每个元素仅附加 1 个类（如示例所示），则可以对类执行相同操作：

$("#ItemDescription li").attr('id',function(i,e){
   if (typeof e != "undefined" && e.substring(0,2)=="x_") return e.substring(2);
}).attr('class',function(i,e){
   if (typeof e != "undefined" && e.substring(0,2)=="x_") return e.substring(2);
});

示例： http://jsfiddle.net/niklasvh/Rfq2n/6/

如果可能有多个类，并且“x_”类不是第一个类，您可以这样做：

$("#ItemDescription li").attr('id',function(i,e){
   if (typeof e != "undefined" && e.substring(0,2)=="x_") return e.substring(2);
}).attr('class',function(i,e){
    if (typeof e != "undefined"){
        if (e.split(" ").length && e.substring(0,2)=="x_")  return e.substring(2);
        var classes = "";
        $.each(e.split(" "),function(i,b){
            if (b.substring(0,2)=="x_") classes +=  " "+b.substring(2);
            else   classes +=  " "+b;
        });  
        return $.trim(classes);
    }
});

示例：http://jsfiddle.net/niklasvh/Rfq2n/16/

在这种情况下，请使用下面评论中提到的解决方案史蒂夫.

Answer 2

这将处理 ID：

$('#itemDescription *').attr('id', function (i, old) {
    if (old.match(/^x_/)) {
        return old.replace(/^x_/, '');
    }
});

jsFiddle 演示