jeudi 13 août 2020

Random selection of element from 2 or more, separate lists

I am new with all these stuff. I found a script here

What i want to do, is to create multiple widgets for my blog, where people can randomly choose items from already listed elements.

The problem here is, that despite creating 4 different widgets, with different arrays each, when i click "Choose" the results are ALWAYS from one of these widgets. I don't know how to rename the arrays or the widgets so that they will seem different and work separately.

Here are 2 examples :

var up = document.getElementById('GFG_UP');
var down = document.getElementById('GFG_DOWN');

var arr = ["Alfa", "Beta"];

$("#edit-field-service-sub-cat-value option[value=" + title + "]").hide();

up.innerHTML = "Click on the button to check " +
  "the type of element.<br><br>" + arr;

function GFG_Fun() {
  down.innerHTML =
    arr[Math.floor(Math.random() * arr.length)];
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!doctype html>
<h1 style="color:green;">
  Choose
</h1>

<p id="GFG_UP" style="font-size: 15px; font-weight: bold;">
</p>

<button id="button" onclick="GFG_Fun()">  
        click here  
    </button>

<p id="GFG_DOWN" style="font-size: 24px; font-weight: bold; color: green;">
</p>

AND the second be like,

var up = document.getElementById('GFG_UP');
var down = document.getElementById('GFG_DOWN');

var arr = ["Gamma", "Delta"];

$("#edit-field-service-sub-cat-value option[value=" + title + "]").hide();

up.innerHTML = "Click on the button to check " +
  "the type of element.<br><br>" + arr;

function GFG_Fun() {
  down.innerHTML =
    arr[Math.floor(Math.random() * arr.length)];
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!doctype html>

<h1 style="color:green;">
  Choose
</h1>

<p id="GFG_UP" style="font-size: 15px; font-weight: bold;">
</p>

<button id="button" onclick="GFG_Fun()">  
        click here  
    </button>

<p id="GFG_DOWN" style="font-size: 24px; font-weight: bold; color: green;">
</p>

<script>
</script>

The results are always from the "Alpha-Beta" list and NEVER from the "Gamma, Delta".

What am i doing wrong? Please...

It works fine when i use ONLY one widget- but i need more. How can i add 2 arrays in the same widget but choose separately from only one of them?




Aucun commentaire:

Enregistrer un commentaire