Question

我正在尝试使用一行JQuery脚本来读取div中找到的每个段落字符串，并在每次有＆＃39;，＆＃39;时拆分该段落。我的问题是我无法一次POST所有数组，所以replaceWith函数只输出数组的第一个值，因为当for条件返回增量到myArray [1]时，数组的其余部分被删除。 / p>

无论如何，我是否要在分组数组中发布每个值＆＃39;分离html元素而不留下初始字符串和/或将每个创建的元素转换为前一个元素的子元素？

样本 http://jsfiddle.net/ry25Q/

HTML

    <div class="data">
        <i>days_of_week</i>
        <p>mon,tue,wed,thur,fri,sat,sun</p>
    </div>
      <div>
        <input type="button" class="btnClick Button" value="Click" />
     </div>

JS CODE

$(function () {
    $('.btnClick').click(function () {
        var data = $('.data p').text();
        var splitter = data.split(',');
        for (var i = 0; i < splitter.length; i++) {
            $(".data p").replaceWith("<span class='dataseg'>" + splitter[i] + "</span>")
        }
    });
});

Answer 1

您不需要循环。由于您只替换了一个p元素，因此只需使用您要插入的完整HTML字符串调用.replaceWith()一次。

DEMO： http://jsfiddle.net/Vfk4e/

$(function () {
    $('.btnClick').click(function () {
        var p = $('.data p');
        var splitter = p.text().split(',');

        var open = "<span class='dataseg'>";
        var close = "</span>"

        p.replaceWith(open + splitter.join(close + open) + close)
    });
});

Answer 2

您只能在$('.data p').text('');声明之前添加for吗？这将清除内容，当你的小提琴.append工作正常时。

$(function () {
    $('.btnClick').click(function () {
        var data = $('.data p').text();
        var splitter = data.split(',');

        $('.data p').text('');

        for (var i = 0; i < splitter.length; i++) {
            $(".data p").append("<span class='dataseg'>" + splitter[i] + "</span>")
        }
    });
});

Answer 3

尝试为要替换span元素的<p>元素创建变量。然后在for循环中，依次将数据添加到span元素。循环之后，关闭span，然后使用span变量调用replaceWith（）。

$(function () {
    $('.btnClick').click(function () {
        var data = $('.data p').text();
        var splitter = data.split(',');
        var daySpan = "<span class='dataseg'>";

        for (var i = 0; i < splitter.length; i++) {
            daySpan += splitter[i]; 
        }

        daySpan += "</span>";

        $(".data p").replaceWith( daySpan );
    });
});

演示：http://codepen.io/imajedi4ever/pen/kpzCD/?editors=101

JQuery：由于.replaceWith操作导致条件无法完成

3 个答案: