Question

我希望添加/删除隐藏div中的输入项，这些div具有来自数组的匹配值。默认情况下，该数组为空，但在单击li项时会向其添加一个值。我希望能够删除与当前数组中的值对应的输入项。

目前我的代码有效，如果您按照添加它们的相同顺序删除这些项目。我希望有这个功能，你可以删除任何顺序的任何输入。有人可以帮助我吗？

以下是我的js：

var downloadArray = [];
var addToArray = function addToArray(src){  
    downloadArray.push(src);

        //If the input value matches the download Array, remove it
        if (downloadArray == $('.result input').attr("value")) {
            $('input[value="' + downloadArray + '"]').remove();
            console.log(downloadArray);

            //Empties array 
            downloadArray = [];
        } else {
            //Attaches value to array
            var result = '<input type="hidden" class="hiddenValue" name="asset[]" value="' + downloadArray + '" />';
            $('.result').append(result);
            console.log(downloadArray);
            //Empties array 
            downloadArray = [];
        }
};

以下是我的HTML：

    <form action="compare_arrays_in_dir.php" method="post">
        <ul>
            <li class="add" onclick="addToArray('file1.psd');"><span>Add File 1</span></li>
            <li class="add" onclick="addToArray('file2.psd');"><span>Add File 2</span></li>
            <li class="add" onclick="addToArray('file3.psd');"><span>Add File 3</span></li>
        </ul>
    <div class="result" id="result"></div>
    <input type="submit" name="submit" value="Submit" />
    </form>

更新：这是一个有效的JSFiddle

Answer 1

首先你的代码和命名很混乱，所以我稍微改了一下。

添加成为切换（实际上就是这样）
对于添加的隐藏元素，我将其显示为测试用途
此外，您应该仅使用ID作为唯一标识符，因此我将其更改为CLASS。

这是JS代码：

var resultsArray = [];
function toogleInResults(src) {
    // Try to find src in array
  var idx = resultsArray.indexOf(src);
  //If it is already there, remove it
  if  (idx >= 0) {
    $('input[value="' + src + '"]').remove();
    resultsArray.splice(idx, 1);
  } else {
    // Add the corresponding html for this src
    var result = '<input class="hiddenValue" name="asset[]" value="' + src + '" />';
    $('.result').append(result);
    // Add src to the array
    resultsArray.push(src);
  }
};

修改后的HTML：

<form action="compare_arrays_in_dir.php" method="post">
  <ul>
    <li class="add" onclick="toogleInResults('file1.psd');"><span>Add File 1</span></li>
    <li class="add" onclick="toogleInResults('file2.psd');"><span>Add File 2</span></li>
    <li class="add" onclick="toogleInResults('file3.psd');"><span>Add File 3</span></li>
  </ul>
  <div class="result" id="result"></div>

</form>

这是非常基础的，所以我建议你学习更多关于js / html / jQuery的内容（如果这不是为了研究目的）。祝你有美好的一天!!

here是一个有效的JSFiddle。

通过检查数组中的值来从div中删除项目

1 个答案: