Question

我已使用此解决方案使用代码标记选择代码框的文本内容。

function SelectText(element) {
    var doc = document
        , text = doc.getElementById(element)
        , range, selection
    ;    
    if (doc.body.createTextRange) {
        range = document.body.createTextRange();
        range.moveToElementText(text);
        range.select();
    } else if (window.getSelection) {
        selection = window.getSelection();        
        range = document.createRange();
        range.selectNodeContents(text);
        selection.removeAllRanges();
        selection.addRange(range);
    }
}

$(function() {
    $('span').click(function() {
        SelectText('selectme');
    });
});

这是我的代码框：

 <div class="codebox"><span>{L_CODE}: {L_SELECT_ALL_CODE}</span><div id="selectme"><code></code></div></div>

问题在于，当同一页面中有多个代码框时，由于ID相同，因此只选择第一个代码框。如何使用动态方式，以便在用户单击以选择所需文本时，无论存在多少个框，都将选择单击的容器？

Answer 1

首先，你不应该有多个元素使用相同的ID（为此目的使用属性CLASS或DATA）。

然后你只需要这样做：

$(".class").click(function(element) {
  // Do crazy stuff with element
})

或使用数据属性：

$("data[foo='blah']").click(function(element) {
  // Do crazy stuff with element
})

选择<code> box</code>点击的文字

1 个答案: