Question

我有很多文本区域，当我单击该文本之外的段落时，应该将其添加到文本区域，它可以工作，但是文本也将添加到上面的文本区域中。

我对为什么会发生这种情况感到有些困惑，因为我有10个textaraes，所以单击页面底部的一个段落会将文本添加到上方的所有其他textareas。

JavaScript

$(document).ready(function () {
    $("#PollutionPreventionDivScrollDisplay").hide();

    $("#PollutionPreventionDivScroll").on("click", function () {
        $("#PollutionPreventionDivScrollDisplay").toggle();
    });

    var cartlist = document.querySelector("#EnvironmentalActionPollutionPreventionIdeasForAction");
    var items = document.querySelectorAll("[data-item]");

    [].forEach.call(items, function (item) {
        item.addEventListener("click", function (e) {
            e.preventDefault();
            cartlist.value += `\n${item.innerHTML}`;
        });
    });
});
$(document).ready(function () {
    $("#WasteDivScrollDisplay").hide();

    $("#WasteDivScrollDisplayScroll").on("click", function () {
        $("#WasteDivScrollDisplay").toggle();
    });

    var cartlistOne = document.querySelector("#EnvironmentalActionWasteManagementIdeasForAction");
    var itemsOne = document.querySelectorAll("[data-item]");

    [].forEach.call(itemsOne,
        function (itemOne) {
            itemOne.addEventListener("click", function (e) {
                e.preventDefault();
                cartlistOne.value += `\n${itemOne.innerHTML}`;
            });
        });
});
$(document).ready(function () {
    $("#EnergyDivScrollDisplay").hide();

    $("#EnergyDivScrollDisplayScroll").on("click", function () {
        $("#EnergyDivScrollDisplay").toggle();
    });

    var cartlistTwo = document.querySelector("#EnvironmentalActionEnergyIdeasForAction");
    var itemsTwo = document.querySelectorAll("[data-item]");

    [].forEach.call(itemsTwo,
        function (itemTwo) {
            itemTwo.addEventListener("click", function (c) {
                c.preventDefault();
                cartlistTwo.value += `\n${itemTwo.innerHTML}`;
            });
        });
});

html的示例

<div class="row">
        <div id="PollutionPreventionDivScrollDisplay" class="col-md-12 border-colour fixed-height">
            @foreach (var info in Model.EnvironmentalActionPollutionPreventionExtraInfo)
            {
                var countItems = counter++;
                <p><a data-item="@countItems" href="#">@info</a></p>
            }
        </div>
    </div>  

 <div class="col-md-4 border-colour-right">
            <div class="form-group">
                <span class="mouse-pointer text-danger" id="PollutionPreventionDivScroll">Click to add options</span>
                <label class="sr-only" for="EnvironmentalActionPollutionPreventionIdeasForActionPlaceholder">Environmental Action Pollution Prevention Ideas For Action</label>
                @Html.TextAreaFor(x => x.EnvironmentalActionPollutionPreventionIdeasForAction, new { Class = "form-control", Placeholder = Model.EnvironmentalActionPollutionPreventionIdeasForActionPlaceholder, rows = "8" })
            </div>
        </div>

所有其他代码都相同，除了相同之处不同

Answer 1

好吧愚蠢的错误，我所有的“数据项”都应该是“数据项一”，“数据项二”等

Onclick文本填充两个文本区域

1 个答案: