ダイナミックIDの入力タイプ範囲出力が機能しない

Question

id値が動的な場合、入力タイプの範囲機能が機能しません。

<input name="gdOverallscore" id="gdOverallscore" type="range" min="0" value="0" max="10" step="1" list="ticks" oninput="ageOutputId.value = gdOverallscore.value"/><output id="ageOutputId">0</output> 
 

 
<h2>This is working fine in my case i have dynamic id which is loop"</h2> 
 
<br> 
 
<input name="gdskill[<?php echo $skillLabel['ssid'];?>]" 
 
     id="gdskill[<?php echo $skillLabel['ssid'];?>]" 
 
     type="range" 
 
     min="0" value="0" max="10" step="1" 
 
     list="ticks" 
 
     oninput="Output.value = gdskill[<?php echo $skillLabel['ssid'];?>].value"/> 
 
<output id="Output">0</output> 
 

 
<br> 
 
<h2> 
 
In the second one id values comes like this: 
 
gdskill[1],gdskill[3],gdskill[4],gdskill[6] etc.. 
 

 
</h2>

Answer 1

あなたは同様にあなたのOuptut IDを変更する必要があるか、他の出力は、したがって、それは文句を言わない仕事のすべてで同じになります。..

<input name="[]" id="gdskill<?php echo $skillLabel['ssid'];?>" 

type="range" min="0" value="0" max="10" step="1" 

oninput="Output<?php echo $skillLabel['ssid'];?>.value = gdskill<?php echo $skillLabel['ssid'];?>.value"/> 

<output id="Output<?php echo $skillLabel['ssid'];?>">0</output> 

Answer 2

次のように使用してみてください：gdOverallscore[0]のようなIDが機能しません。複数のケースで

<?php 

    $skillLabel['ssid']=10; 

    ?> 

    <input name="gdOverallscore" id="gdOverallscore" type="range" min="0" value="0" max="10" step="1" list="ticks" oninput="ageOutputId.value = gdOverallscore.value"/><output id="ageOutputId">0</output> 


    <input name="gdskill<?php echo $skillLabel['ssid'];?>" 
      id="gdskill<?php echo $skillLabel['ssid'];?>" 
      type="range" 
      min="0" value="0" max="10" step="1" 
      list="ticks" 
      oninput="Output.value = gdskill<?php echo $skillLabel['ssid'];?>.value"/> 
    <output id="Output">0</output> 

：

<?php 

$skillLabel['ssid'][0]=10; 
$skillLabel['ssid'][1]=11; 

?> 

<?php foreach($skillLabel['ssid'] as $key=>$value){?> 
<input name="gdskill<?php echo $value;?>" 
     id="gdskill<?php echo $value;?>" 
     type="range" 
     min="0" value="0" max="10" step="1" 
     list="ticks" 
     oninput="Output<?php echo $value;?>.value = gdskill<?php echo $value;?>.value"/> 
<output id="Output<?php echo $value;?>">0</output> 

<?php }?> 

DEMO