Hva er den beste måten å skape en popover for hvert eneste ord i et avsnitt på DblClick? (HTML / CSS / Bootstrap4 / JQuery)

stemmer
0

Jeg prøver å lage noe som ligner på Kindle Ord Wise og MacOS ordlisten funksjonen for en klasse. Mitt mål er å gi brukeren dobbeltklikk på et ord og vise sin definisjon. Jeg er veldig nytt for front end programmering, så jeg har hatt en masse problemer. Jeg prøvde mitt beste for å forske og prøve ulike metoder for å oppnå min ønskede sluttresultat, men jeg kan ikke synes å få det til å fungere.

Så i utgangspunktet, hver gang en bruker dobbeltklikk på et ord, bør en popover vises med sin definisjon. Jeg ønsket å finne en måte å skape popovers på et klikk hendelse, snarere enn hardt koding i popover attributt for hvert ord.

Dette er koden jeg har så langt.

function getSelectedText(){
    var selectedText = '';
        if (window.getSelection)
               selectedText = window.getSelection();
return selectedText;
}


$(document).ready(function()
{
  $(function () {
   $('[data-toggle=tooltip]').tooltip()
})

$(function () {
  $('[data-toggle=popover]').popover()
})

$('#selectable').on(dblclick, function () {
$('.selection').text(getSelectedText());
$('.is-selected').text(getSelectedText() != );
    });

$('#selectable').on('click',function (e) {
 var text= getSelectedText();
 $( '#selectable:contains(text)' ).replaceWith('<span data-toggle=popover data-placement=bottom data-content=testing popover>' + text +'</span>')
});
});
Publisert på 14/02/2020 klokken 00:05
kilden bruker
På andre språk...                            

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more