选择没有最后一个空格的潜水文本答案

【问题标题】：select dive text without last space选择没有最后一个空格的潜水文本
【发布时间】：2019-07-22 13:09:18
【问题描述】：

我需要在鼠标点击时选择 div 内容（只有 TEXT 没有最后一个空格）

<div>
                    <div id="block1">
                        Please send the following code
                    </div>
                    <div id="block2" style="font-size:40px; background-color:#fffb95;" onclick="selectText('block2')" >
                        @Html.DisplayFor(c => c.GeneratedCode, new { id = "genCode" })
                    </div>
                    <div id="block3">
                        to your vendor to generate an access code which is required for your authentication.
                    </div>
                </div>

脚本

function selectText(containerid) {
        if (document.selection) { // IE
            var range = document.body.createTextRange();
            range.moveToElementText(document.getElementById(containerid));
            range.select();
        } else if (window.getSelection) {
            var range = document.createRange();
            range.selectNode(document.getElementById(containerid));

            window.getSelection().removeAllRanges();
            window.getSelection().addRange(range );
        }
    }

风格

#block1, #block2, #block3 {
        display: inline;
    }

    .input-lg {
        height: 43px;
    }

这是选择前的输出 here 当我选择 here 我想从选择中删除最后一个空格

【问题讨论】：

标签： javascript jquery css asp.net-mvc

【解决方案1】：

你的意思是这样吗？ - 我只是把生成的代码放在一个span里，然后我把style属性放在span上。

   function selectText(containerid) {
        if (document.selection) { // IE
            var range = document.body.createTextRange();
            range.moveToElementText(document.getElementById(containerid));
            range.select();
        } else if (window.getSelection) {
            var range = document.createRange();
            range.selectNode(document.getElementById(containerid));
           range.cloneRange();
            window.getSelection().removeAllRanges();
            window.getSelection().addRange(range );
        }
    }

#block1, #block2, #block3 {
    display: inline;
}

.input-lg {
    height: 43px;
}

<div>
    <div id="block1">
        Please send the following code
    </div>
    <div id="block2"  onclick="selectText('block2')">
        <span style="font-size:40px; background-color:#fffb95;">2256</span>
    </div>
    <div id="block3">
        to your vendor to generate an access code which is required for your authentication.
    </div>
</div>

【讨论】：

【解决方案2】：

听起来您只是想在单击它时从block2 获取文本，并且您想摆脱它末尾的空白。我看到了帖子的 jquery 标签，所以你可以试试这个

$('#block2').on('click', function() {
    const divText = $(this).text().trim();

    console.log(divText);
    return divText;
})

不是 100% 确定这是您正在寻找的内容，而且我从未使用过 getSelection()，但从阅读中我会假设，如果您要使用 getSelection()，请在获得选择删除空格

【讨论】：