如何删除 JS var 中的空格？

Posted 2023-05-08

【中文标题】如何删除 JS var 中的空格？

【英文标题】：How to remove empty spaces in JS var?

【发布时间】：2021-10-29 15:58:28

【问题描述】：

加入push值后如何去除var con_str中的空白？

html

<input type="checkbox" id="chckBox1" onchange="fnTest(this);" /> <a class="ref"> Banana </a>
<input type="checkbox" id="chckBox2" onchange="fnTest(this);" /> <a class="ref"> Apple </a>
<input type="checkbox" id="chckBox3" onchange="fnTest(this);" /> <a class="ref"> Orange </a>

<input type="button" id="testABC" onclick="submit()" value="OK" />

JS

function fnTest(check) 

    $(check).is(':checked')


function submit() 

    var values = [];
    $("input[type=checkbox]:checked").each(function()
        values.push($(this).next("").text());
    );

    var con_str = "https://www.url-abc.com/"+values.join();
    window.open(con_str.trim());

如果我选中所有三个复选框，这就是我现在的输出。

https://www.url-abc.com/%20Banana%20,%20Apple%20,%20Orange

我想要的输出

https://www.url-abc.com/Banana,Apple,Orange

我尝试添加 con_str.trim()。但它没有用。

这是小提琴，https://jsfiddle.net/izzatz/yx7bn59r/7/

【参考方案1】：

您的<a>s 的内容末尾有空格。修剪它们。

$("input[type=checkbox]:checked").each(function()
    values.push($(this).next("").text().trim());
);

更优雅的方法，使用.map而不是.push：

const values = [...$("input[type=checkbox]:checked")]
  .map(input => input.nextElementSibling.textContent.trim());

【讨论】：

啊开枪！这是一个愚蠢的错误。我认为修剪会处理它。谢谢！

【参考方案2】：

您可以使用map()、get() 和join() 来获取逗号分隔的字符串，如下所示：

var values = $("input[type=checkbox]:checked").map(function()
    return $(this).next("").text().trim();
).get().join(',');

演示：

function fnTest(check) 

    $(check).is(':checked')


function submit() 

    var values = $("input[type=checkbox]:checked").map(function()
        return $(this).next("").text().trim();
    ).get().join(',');

    var con_str = "https://www.url-abc.com/"+values;
    console.log(con_str)
    //window.open(con_str.trim());

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" id="chckBox1" onchange="fnTest(this);" /> <a class="ref"> Banana </a>
<input type="checkbox" id="chckBox2" onchange="fnTest(this);" /> <a class="ref"> Apple </a>
<input type="checkbox" id="chckBox3" onchange="fnTest(this);" /> <a class="ref"> Orange </a>

<input type="button" id="testABC" onclick="submit()" value="OK" />