javascript - 更改克隆中的某些内容

Question

前 2 个 div 来自数据库，第 3 个是克隆。问题是我想更改克隆，但如果我这样做，所有 div 都会更改。

我想要什么:

1- 红线(如果值为 false)不得应用于克隆

2- 克隆必须用 1 个(另一个图标)跨度替换 2 个跨度(图标)

我用于克隆的代码是

$(document).on("input", ".add", function(obj){
    if ($(this).next(".add").length > 0){

  } else {
        $(this).clone().insertAfter( this ).find("input:text").val("");
  }
});

我用于红线的代码是

$('.statuss').each (function(obj){

    if ($(this).val() == "False")
        {

            $(this).parent().find('div').css("background", "#ff8080");
        }})

很抱歉没能给出 fiddle 。

编辑:

这两个图标是 (ui-icon.ui-icon-closethick 和 ui-icon.ui-icon-check) 必须替换为 (ui-icon-close)

Answer 1

试试这个对克隆进行更改，希望这有帮助。

$(this)
.clone()
.removeClass()
.addClass('ui-icon.ui-icon-close')
.appendTo('body');

根据您的问题，我了解到您想创建一个几乎没有新更改的元素的克隆。我只是向您展示了如何做到这一点，您可以根据需要进行必要的更改。

有关详细信息，请参阅工作代码段。

$('a.clone').click(function(){
  $('.neeToClone')
    .clone()
    .removeClass('ui-icon.ui-icon-closethick ui-icon.ui-icon-check neeToClone')
    .addClass('ui-icon.ui-icon-close')
    .css('color', 'red')
    .html('Clonned DIV')
    .appendTo('body');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="ui-icon.ui-icon-closethick and ui-icon.ui-icon-check neeToClone">Div-1</div>

<a href="javascript:void(0)" class="clone">Clone</a>

Edit-1:添加了新代码

$(document).on("input", ".yourDiv", function(){
    if ($(this).next(".yourDiv").length > 0){
    console.log("There is already a Clone of this Div")
  } else {
    var clone = $(this).clone();
    $(clone).find('span.ui-icon-closethick').removeClass('ui-icon ui-icon-closethick').addClass('ui-icon ui-icon-close');
    $(clone).find('span.ui-icon-check').remove();
    $(clone).insertAfter(this).find("input:text").val("");
  }
});