I’m happy with how my script is working but I’m told I shouldn’t be using eval()
– which I’m using twice. Is that true? How would I do that? There are several posts about this but I can’t make them work this situation. (Below is a simplified version of http://www.JBM-Computing.net/Music.shtml?Music=keys)
javascript:
sharpKeys = ['G maj','D maj','A maj','E maj','B maj','F# maj','C# maj']
flatKeys = ['F maj','Bb maj','Eb maj','Ab maj','Db maj','Gb maj','Cb maj']
function newKey(){
kArray = document.querySelector("input[type='radio'][name='sel']:checked").value
keys = eval(kArray)
num = Math.floor(Math.random() * (keys.length - 2))
key = keys.splice(num,1)
eval(kArray).push(key)
document.getElementById('pKey').innerHTML = key
}
html:
<form>
<input type="radio" id="js" name="sel" value="sharpKeys" checked><label for="js">sharp keys</label>
<input type="radio" id="jf" name="sel" value="flatKeys"> <label for="jf">flat keys</label>
</form>
<p><button onClick="newKey()">random key</button></p>
<p id="pKey"></p>
(FYI the random selection is such that the current selection will not be chosen in the next 2 clicks.)