jQuery एक अनुच्छेद

Question

में पाठ का चयन करें और इसमें स्पैन जोड़ें मेरे पास एक ऐसा फ़ंक्शन है जो चयनित टेक्स्ट प्राप्त करता है, पाठ माउस द्वारा चुना जाता है, और इसे एक चर में जोड़ता है। मैं उस पैराग्राफ में चयनित पाठ में उस चर के चारों ओर टैग जोड़ना चाहता हूं।

$("p").live("mouseup",function() { 
    selection = getSelectedText(); 
    if(selection.length >= 3) { 
     var $spn = $("<span></span>").html(selection).addClass("selected"); 
     $("p").wrap($spn); 
    } 
}); 

//Grab selected text 
function getSelectedText(){ 
    if(window.getSelection){ 
     return window.getSelection().toString(); 
    } 
    else if(document.getSelection){ 
     return document.getSelection(); 
    } 
    else if(document.selection){ 
     return document.selection.createRange().text; 
    } 
} 

मैं पाठ चयन चर प्राप्त कर सकते हैं, लेकिन इसके बजाय पैरा <p> से चयनित पाठ के आसपास <span></span> रखने की, मेरे समारोह इस बाहर घूमती है।

मैं इसे पैराग्राफ में कैसे बदल सकता हूं? धन्यवाद।

Answer 1

यह जहां यह गलत हो जाता है:

var $spn = $("<span></span>").html(selection).addClass("selected"); 
$("p").wrap($spn); 

इसका मतलब है आप पैराग्राफ के आसपास span लपेटकर रहे हैं।

मुझे लगता है कि आप इस तरह से कुछ करने के लिए मतलब है:

var spn = '<span class="selected">' + selection + '</span>'; 
$(this).html($(this).html().replace(selection, spn)); 

Answer 2

untested है, लेकिन काम करना चाहिए:

$("p").live("mouseup",function() { 
selection = getSelectedText(); 
if(selection.length >= 3) { 
var $spn = $("<span></span>").html(selection).addClass("selected"); 
$(this).html($(this).html().replace(selection, $spn); 
} 
}); 

Answer 3

मुझे लगता है कि आप, पैराग्राफ में पाठ बदलने के लिए नहीं का उपयोग की आवश्यकता होगी लपेट दें।

$("p").live("mouseup",function() { 
    selection = getSelectedText(); 
    if(selection.length >= 3) { 
     var spn = "<span class='selected'>" + selection + "</span>"); 
     var html = $(this).html().replace(selection,spn); 
     $(this).html(html); 
    } 
}); 

ध्यान दें कि यह केवल मज़बूती से काम करने के लिए करता है, तो पैरा केवल पाठ और कोई मार्कअप शामिल रहा है।

Answer 4

उपयोग .wrapInner() बजाय .wrap()

Answer 5

कोशिश चयन ट्रिम और html-आंतरिक पंक्ति विराम को बदलने के लिए। इससे बहुत मदद मिलती है:

$('#tweet_contents').live("mouseup",function() { 
    selection = getSelectedText().replace(/^\s+|\s+$/g,""); 

    if(selection.length >= 4) { 
     var spn = '<span id=\"selected\" class=\"polarite\" selcount=\"'+selcounter+'\" >'+selection+'<span id=\"superscript\">'+selcounter+'<\/span>'+'<\/span>'; 

    $(this).html($(this).html().replace(/(\r\n|\n|\r)/gm," ").replace(selection, spn)); 
    } 
});