Question

我似乎无法弄清楚为什么我的数组会有一个尾随的空格。基于所选li项目构建我的数组后的最终结果如下所示：1234 ,0123如何获得输出：1234,0123？

以下是有问题的守则：

var arr_numbers = [];
window.onload = function() {

    $(document).bind('click', function(e) {
        var $clicked = $(e.target);
        if (!$clicked.hasClass("select")) {
            $(this).find('ul li').hide();
        }
    });

    $(".select").click(function () {
        $(this).find('ul li').toggle();
    });

    $(".select ul li").click(function(e) {
        if (e.ctrlKey) {
            e.stopPropagation();
            if ($(this).hasClass('selected')) {                        
                $(this).removeClass('selected');
            }
            else {
                $(this).addClass('selected');
            }

            var c = $(this).parent().find("li.selected").length;

            $(this).closest("div").contents().first()
              .replaceWith((c > 1) ? "(" + c + ")" : $(this).text());
        }
        else {
            $(this).closest("div").contents().first()
              .replaceWith($(this).text());

            var id = $(this).closest('[id]').attr('id');
            $(this).closest('.select').find("ul li").removeClass('selected');
            $(this).addClass('selected');
        }
    }); 
}


function get_data_array(element) {
    if (element == 'numbers') {
        var data_array_numbers = [];
        var list = $("#numbers ul").find("li.selected")
        $.each(list, function() {
            //alert($(this).data('val'));
            //alert($(this).text());                
            data_array_numbers.push($(this).text());
        });
        alert(data_array_numbers);
    }
}

这是HTML：

Numbers
<div class="select" id="numbers">&nbsp;
    <ul>
        <li>&nbsp;</li>
        <li data-val="1234">1234</li>
        <li data-val="5678">5678</li>
        <li data-val="0123">0123</li>
    </ul>
</div>
<br><br>
Letters
<div class="select" id="letters">&nbsp;
    <ul>
        <li>&nbsp;</li>
        <li>abcd</li>
        <li>efgh</li>
        <li>ijkl</li>
    </ul>
</div>
<br><br>
Fruits
<div class="select" id="fruits">&nbsp;
    <ul>
        <li>&nbsp;</li>
        <li>apples</li>
        <li>bananas</li>
        <li>oranges</li>
    </ul>
</div>

<br><br>
<input type="button" value="test" onclick="get_data_array('numbers')">

Answer 1

使用 jQuery.trim() ，从字符串的开头和结尾删除空格

data_array_numbers.push(jQuery.trim($(this).text()))

Answer 2

除了@Pranav的答案，您还可以使用通常的字符串修剪：

data_array_numbers.push($(this).text().trim());

请注意，它不起作用＆lt; = ie8

w3 reference

根据选定的UL LI项生成数组 - 如何删除尾随空格？

2 个答案: