Bună ziua, mă puteți ajuta să adaug până la 5 selecții de elemente de listă în Javascript? (Programare, Javascript, Lista, Liste Html)

Luca a intrebat.
a intrebat.

Deci, sunt un începător absolut la JS, dar aș dori să am o listă pe care un utilizator poate selecta până la 5 opțiuni, care apar într-un div separat. După cum puteți vedea, am reușit să fac să funcționeze unul la clic.

<ul id="products">
        <li>Bell Box Labels</li>
        <li>Camera Labels</li>
        <li>CCTV Signs</li>
        <li>Certificates & Job Books</li>
        <li>Extinguisher Labels</li>
        <li>Fascia Overlays</li>
        <li>Fire Exit Signage</li>
        <li>Panel Labels</li>
        <li>Serviced By Labels</li>
        <li>Warning Boards</li>
        <li>Window Stickers</li>
    </ul>




<script type="text/javascript">

    var lis = document.getElementById("products").getElementsByTagName('li');

    for (var i=0; i<lis.length; i++) {
        lis[i].addEventListener('click', sampleChoice);
    }


    function sampleChoice() {
        document.getElementById("selection").innerHTML = this.innerHTML;

    }


</script>

Comentarii

  • postați codul complet… –  > Por balajisoundar.
  • Codul complet a fost adăugat, mulțumesc. –  > Por Luke.
1 răspunsuri
balajisoundar

acest lucru funcționează pentru mine

<ul id="products">
    <li>Bell Box Labels</li>
    <li>Camera Labels</li>
    <li>CCTV Signs</li>
    <li>Certificates & Job Books</li>
    <li>Extinguisher Labels</li>
    <li>Fascia Overlays</li>
    <li>Fire Exit Signage</li>
    <li>Panel Labels</li>
    <li>Serviced By Labels</li>
    <li>Warning Boards</li>
    <li>Window Stickers</li>
</ul>
<button onclick="resetSelection()">reset</button>
<div id="selection"></div>



<script type="text/javascript">

var lis = document.getElementById("products").getElementsByTagName('li');

for (var i=0; i<lis.length; i++) {
    lis[i].addEventListener('click', sampleChoice);
}

var count=0;
function sampleChoice() {
    if(count<5)
        {
            document.getElementById("selection").innerHTML+= this.innerHTML;
            count++;
}}
function resetSelection()
{
    count=0;
    document.getElementById("selection").innerHTML= "";

}

Comentarii

  • Perfick, ești un sfânt. –  > Por Luke.
  • Dacă aș vrea să selecteze doar un singur element din elementul respectiv, în loc să se dubleze, ca și cum aș vrea să aleg doar 5 din listă fără dubluri? –  > Por Luke.
  • Este fantastic, vă mulțumesc pentru ajutor, iar acum tot ce trebuie să fac este să adaug declarații else pentru fiecare caz pentru a afișa mesaje diferite. Cum ar fi „Ați selectat un număr prea mare de mostre” și „Se poate selecta doar un singur produs”. –  > Por Luke.