Comment copier les éléments sélectionnés de la liste à plusieurs niveaux dans la zone de texte

Question

Je crée un petit guide de dépannage qui est créé dans Jquery et HTML. Lorsque l'utilisateur sélectionne une étape, celle-ci est conçue pour passer à l'étape suivante pour essayer de passer à la suivante dans le style d'un organigramme.

Je voulais ajouter un bouton de sélection afin qu'une fois que l'utilisateur a terminé un flux de dépannage, il devrait être capable de copier automatiquement tous les éléments sélectionnés dans une zone de texte. Quelqu'un peut-il m'aider avec un code qui va sélectionner tous les éléments sélectionnés par l'utilisateur à partir du flux et les coller/les remplir dans une zone de texte.

Veuillez trouver le code que j'ai utilisé pour le guide de dépannage. Toute aide sera appréciée très .. Merci d'avance ..

$('document').ready(function(){ 
var count = 0; 
$('#questions').hide(); 
$('#answers').hide(); 
$('#questions tr:nth-child(2)').attr('id','currow');  
var q1 = $('#currow td:nth-child(2)').html(); 
var q3 = '<div id="d' + count + '"><p>' + q1 + '</p>' ; 
var a1 = $('#currow td:nth-child(3)').html(); 
var r1 = q3 + a1 +'</div>'; 
$('#showquestion').html(r1); 

$('li').live('click',function(){ 
    $(this).addClass('selected').siblings().removeClass('selected'); 
    var target = $(this).attr('id'); 
    var parid = $(this).parent().parent().attr('id'); 
    var parnum = parseInt(parid.slice(1,3)); 
    count = count + 1; 
    var ps = $('#showquestion div').length; 
    $('#showquestion div').each(function() { 
     var divid = $(this).attr('id'); 
     var divnum = parseInt(divid.slice(1,3)); 
     if(divnum > parnum) 
      $(this).remove() 
     }) 
    $('td').each(function(){ 
     var qnum = $(this).text(); 
     if(qnum == target) { 
      var q = $(this).next('td').html(); 
      var q2 = '<div id="d' + count + ' "><p>' + q + '</p>'; 
      var a = $(this).next('td').next('td').html(); 
      var qs = $('#showquestion').html(); 
      var r = qs + q2 + a +'</div>'; 
      $('#showquestion').html(r); 
      window.scrollBy(0,400); 
      } 
     }) 
    }) 
}) 

<div class="luiTitle"><a href="http://google.com" style=" text-decoration:none;   color:#bbb">Support System </a></div> 

<div id="showquestion" class="answers"></div> 

<p><a href="TEST1.HTML"title="To my second webpage">Click here to go back to Selection Page</a></p> 

<table width="50%" border="0" cellspacing="1" cellpadding="2" id="questions" > 
<tr> 
<td>No</td> 
<td>Question/Heading </td> 
<td>Answers </td> 
</tr> 

<tr> 
<td>1</td> 
<td>Question 1</td> 
<td><ul> 
    <li id="2">Option 1</li> 
    <li id="3">Option 2</li> 
    <li id="4">Option 3</li> 

</ul></td> 
</tr> 
<tr> 
<td>2</td> 
<td>Level 2 - from question 1 Option 1</td> 
<td><ul> 
    <li id="5">Option 1</li> 
    <li id="6">Option 2</li> 

</ul></td> 
</tr> 
<tr> 
<td>3</td> 
<td>Level 2 - from question 1 - no</td> 
<td><ul> 
    <li id="9">Option 1</li> 
    <li id="10">Option 2</li> 
    <li id="6">Option 3</li> 
    <li id="7">Option 4</li> 
</ul></td> 
</tr> 
<tr> 
<td>4</td> 
<td>Level 3 - from level 2 option 1</td> 
<td><ul> 
    <li id="11">Option 1</li> 
    <li id="12">Option 2</li> 
    <li id="13">Option 3</li> 
<li id="13">Option 4</li> 
</ul></td> 
</tr> 

Answer 1

document est un objet, quand vous dites $('document'), jQuery va essayer de chercher étiquette document sur la page. Changez cela en $(document).ready() et essayez-le.

var parid = $(this).parent().parent().attr('id'); dans cette ligne this des points à l'élément li et parent de parent donnera une td qui ne dispose pas d'identifiant, donc parid sera toujours nul ou vide.