Проверьте, существует ли образец перед вставкой и существует ли вставка в следующем столбце - PullRequest
Новая
       8

Проверьте, существует ли образец перед вставкой и существует ли вставка в следующем столбце

0 голосов
/ 29 марта 2020

У меня есть функция для вставки сгенерированных пользователем образцов градиента в столбцы bootstrap, но я хочу проверить, есть ли уже образец, и если да, вставить в следующий столбец. Также соберите сгенерированный пользователем заголовок этого из значения подсластителя, которое я не могу вывести за пределы функции alert. В данный момент он записывает первый образец градиента, а затем просто вставляет col-md-4s в последующие записи без градиента. У столбцов есть идентификатор bg-градиента, который предназначен только для размера. Ниже приведен код, если есть какие-либо советы о том, как проверить, есть ли уже образец, (и выпуск подсластителя для получения заголовка). Спасибо 

function createSwatch () {
    showdata.textContent = `linear-gradient(to right, ${colorone.value}, ${colortwo.value})`;
    // Set the actual css style value/statement for the gradient
    let gradient = showdata.textContent;
    // Get just the hex values to display/user copy
    let hexValues = `${colorone.value} - ${colortwo.value}`;
    // Select the inputed value/statement to copy
    let range = document.createRange();
    range.selectNode(document.getElementById("showvalue"));
    window.getSelection().removeAllRanges(); // clear current selection
    window.getSelection().addRange(range); // to select text
    // Copy the css statement
    document.execCommand("copy");
    window.getSelection().removeAllRanges();// to deselect
    // Name the new watch
    swal("Give Your Swatch a Name:", {
        content: "input",
      })
      .then((value) => {
        swal(`Cool, its called: ${value}`)
    });
    //let swatchValue = swal.value;
    //console.log(swatchValue);
    // Create the swatch elements, starting with the class and id
    let newDiv = document.createElement('div');
    newDiv.classList.add("col-md-3");
    newDiv.setAttribute("id", "bg-gradient");
    // Add the user input to give swatch a title, with the hex values, and edit/delete buttons
    newDiv.innerHTML = `<h5><input type='text' onclick='add_text()' value='Set Title' /></h5><br />${hexValues}`;
    // Conditional statement to check if swatch exists before insertion
    let newSwatch = document.querySelector('.row');
    // FIX THIS BIT
    newSwatch.appendChild(newDiv);
    let swatch = document.getElementById("bg-gradient");
    swatch.style.backgroundImage = gradient;
    //console.log(gradient);
}

Также на самом деле хотел бы отобразить образец, как изображение, прикрепленное, если возможно. Спасибо enter image description here

...