通过JQuery选择li元素的文本

时间:2015-08-05 10:29:46

标签: javascript java jquery user-interface

如何通过JQuery从列表元素中选择文本。我想要.select()中与javascript相同的功能,但这仅适用于可编辑的文本区域/输入框,有人可以指导我,与列表元素具有相同的功能

我希望在.click()上选择列表文字。

2 个答案:

答案 0 :(得分:1)

试试这个:http://jsfiddle.net/bigneo/w0y5yrcr/1/

<强> HTML

<ul id="ulmonth">
    <li>Jan</li>
    <li>Feb</li>
    <li>Mar</li>
    <li>Apr</li>
    <li>May</li>
    <li>Jun</li>
    <li>Jul</li>
    <li>Aug</li>
    <li>Sep</li>
    <li>Oct</li>
    <li>Nov</li>
    <li>Dec</li>    
</ul>

<强> JS

$.fn.OneClickSelect = function(){
    return $(this).on('click',function(){
    var range, selection;
    if (window.getSelection) {
            selection = window.getSelection();        
            range = document.createRange();
            range.selectNode(this);
            selection.removeAllRanges();
            selection.addRange(range);
     } 
     else if (document.body.createTextRange) {
            range = document.body.createTextRange();
            range.moveToElementText(this);
            range.select();
     }
    });
};

// Apply to these elements
$('li, #all-select').OneClickSelect();

我想我在这篇文章中找到了你的答案: https://codereview.stackexchange.com/questions/38089/select-text-with-just-one-click

答案 1 :(得分:0)

http://jsfiddle.net/zfk9s8zq/

<强> HTML

<ul id="ulmonth">
    <li>Jan</li>
    <li>Feb</li>
    <li>Mar</li>
    <li>Apr</li>
    <li>May</li>
    <li>Jun</li>
    <li>Jul</li>
    <li>Aug</li>
    <li>Sep</li>
    <li>Oct</li>
    <li>Nov</li>
    <li>Dec</li>    
</ul>    
<label id="lblTest"></label>

<强> JQUERY

$(function(){
    $("#ulmonth li").css("cursor","pointer");
    $("#ulmonth li").click(function(){
        var txt = $(this).text()
        $("#lblTest").text(txt);
    })
})