Див айдишки дублируются подскажите пожалуйста как исправить ошибку {literal} <script> function show_s1_{/literal}{$us.id}{literal}() { document.getElementById('s1_{/literal}{$us.id}{literal}').style.display='block'; document.getElementById('s2_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s3_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s4_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s5_{/literal}{$us.id}{literal}').style.display='none'; } //---------------- function show_s2_{/literal}{$us.id}{literal}() { document.getElementById('s1_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s2_{/literal}{$us.id}{literal}').style.display='block'; document.getElementById('s3_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s4_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s5_{/literal}{$us.id}{literal}').style.display='none'; } //---------------- function show_s3_{/literal}{$us.id}{literal}() { document.getElementById('s1_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s2_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s3_{/literal}{$us.id}{literal}').style.display='block'; document.getElementById('s4_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s5_{/literal}{$us.id}{literal}').style.display='none'; } //---------------- function show_s4_{/literal}{$us.id}{literal}() { document.getElementById('s1_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s2_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s3_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s4_{/literal}{$us.id}{literal}').style.display='block'; document.getElementById('s5_{/literal}{$us.id}{literal}').style.display='none'; } //---------------- function show_s5_{/literal}{$us.id}{literal}() { document.getElementById('s1_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s2_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s3_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s4_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s5_{/literal}{$us.id}{literal}').style.display='block'; } /////////////////////////////////////////////////// function hide_s1_{/literal}{$us.id}{literal}(){ document.getElementById('s1_{/literal}{$us.id}{literal}').style.display='block'; document.getElementById('s2_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s3_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s4_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s5_{/literal}{$us.id}{literal}').style.display='none'; } function process_{/literal}{$us.id}{literal}() { if ( rateDoc.readyState != 4 ) return ; document.getElementById("small_rate_{/literal}{$us.id}{literal}").innerHTML = rateDoc.responseText ; } var rateDoc = null ; function load5_{/literal}{$us.id}{literal}() { if (typeof window.ActiveXObject != 'undefined' ) { rateDoc = new ActiveXObject('Microsoft.XMLHTTP'); rateDoc.onreadystatechange = process_{/literal}{$us.id}{literal} ; } else { rateDoc = new XMLHttpRequest(); rateDoc.onload = process_{/literal}{$us.id}{literal} ; } rateDoc.open( 'GET', '/ajax_page/ajax_users_rate.php?id={/literal}{$us.id}{literal}&task=plus_rate&rate=5', true ); rateDoc.send( null ); } function load4_{/literal}{$us.id}{literal}() { if (typeof window.ActiveXObject != 'undefined' ) { rateDoc = new ActiveXObject('Microsoft.XMLHTTP'); rateDoc.onreadystatechange = process_{/literal}{$us.id}{literal} ; } else { rateDoc = new XMLHttpRequest(); rateDoc.onload = process_{/literal}{$us.id}{literal} ; } rateDoc.open( 'GET', '/ajax_page/ajax_users_rate.php?id={/literal}{$us.id}{literal}&task=plus_rate&rate=4', true ); rateDoc.send( null ); } function load3_{/literal}{$us.id}{literal}() { if (typeof window.ActiveXObject != 'undefined' ) { rateDoc = new ActiveXObject('Microsoft.XMLHTTP'); rateDoc.onreadystatechange = process_{/literal}{$us.id}{literal} ; } else { rateDoc = new XMLHttpRequest(); rateDoc.onload = process_{/literal}{$us.id}{literal} ; } rateDoc.open( 'GET', '/ajax_page/ajax_users_rate.php?id={/literal}{$us.id}{literal}&task=plus_rate&rate=3', true ); rateDoc.send( null ); } function load2_{/literal}{$us.id}{literal}() { if (typeof window.ActiveXObject != 'undefined' ) { rateDoc = new ActiveXObject('Microsoft.XMLHTTP'); rateDoc.onreadystatechange = process_{/literal}{$us.id}{literal} ; } else { rateDoc = new XMLHttpRequest(); rateDoc.onload = process_{/literal}{$us.id}{literal} ; } rateDoc.open( 'GET', '/ajax_page/ajax_users_rate.php?id={/literal}{$us.id}{literal}&task=plus_rate&rate=2', true ); rateDoc.send( null ); } function load1_{/literal}{$us.id}{literal}() { if (typeof window.ActiveXObject != 'undefined' ) { rateDoc = new ActiveXObject('Microsoft.XMLHTTP'); rateDoc.onreadystatechange = process_{/literal}{$us.id}{literal} ; } else { rateDoc = new XMLHttpRequest(); rateDoc.onload = process_{/literal}{$us.id}{literal} ; } rateDoc.open( 'GET', '/ajax_page/ajax_users_rate.php?id={/literal}{$us.id}{literal}&task=plus_rate&rate=1', true ); rateDoc.send( null ); } </script> {/literal} <div class="mt-3 mb-3" style='width:100px; height:auto;'> <div id='s1_{$us.id}'> <div id='div_s1' onmouseover='show_s1_{$us.id}();' onclick='load1_{$us.id}();'> </div> <div id='div_s2' onmouseover='show_s2_{$us.id}();'> </div> <div id='div_s3' onmouseover='show_s3_{$us.id}();'> </div> <div id='div_s4' onmouseover='show_s4_{$us.id}();'> </div> <div id='div_s5' onmouseover='show_s5_{$us.id}();'> </div> <img src='/images/stars/s1.png' alt='s1' class='' width='100'/> </div> <div id='s2_{$us.id}' style='display:none;'> <div id='div_s1' onmouseover='show_s1_{$us.id}();'> </div> <div id='div_s2' onmouseover='show_s2_{$us.id}();' onclick='load2_{$us.id}();'> </div> <div id='div_s3' onmouseover='show_s3_{$us.id}();'> </div> <div id='div_s4' onmouseover='show_s4_{$us.id}();'> </div> <div id='div_s5' onmouseover='show_s5_{$us.id}();'> </div> <img src='/images/stars/s2.png' alt='s2' class='' width='100'/> </div> <div id='s3_{$us.id}' style='display:none;'> <div id='div_s1' onmouseover='show_s1_{$us.id}();'> </div> <div id='div_s2' onmouseover='show_s2_{$us.id}();'> </div> <div id='div_s3' onmouseover='show_s3_{$us.id}();' onclick='load3_{$us.id}();'> </div> <div id='div_s4' onmouseover='show_s4_{$us.id}();'> </div> <div id='div_s5' onmouseover='show_s5_{$us.id}();'> </div> <img src='/images/stars/s3.png' alt='s3' class='' width='100'/> </div> <div id='s4_{$us.id}' style='display:none;'> <div id='div_s1' onmouseover='show_s1_{$us.id}();'> </div> <div id='div_s2' onmouseover='show_s2_{$us.id}();'> </div> <div id='div_s3' onmouseover='show_s3_{$us.id}();'> </div> <div id='div_s4' onmouseover='show_s4_{$us.id}();' onclick='load4_{$us.id}();'> </div> <div id='div_s5' onmouseover='show_s5_{$us.id}();'> </div> <img src='/images/stars/s4.png' alt='s4' class='' width='100'/> </div> <div id='s5_{$us.id}' style='display:none;'> <div id='div_s1' onmouseover='show_s1_{$us.id}();'> </div> <div id='div_s2' onmouseover='show_s2_{$us.id}();'> </div> <div id='div_s3' onmouseover='show_s3_{$us.id}();'> </div> <div id='div_s4' onmouseover='show_s4_{$us.id}();'> </div> <div id='div_s5' onmouseover='show_s5_{$us.id}();' onclick='load5_{$us.id}();'> </div> <img src='/images/stars/s5.png' alt='s5' class='' width='100'/> </div> <p class="w-100 mt-2"><b>{$all_lang[97]}:</b> <span id='small_rate_{$us.id}' name='small_rate_{$us.id}'>{$us.rate}</span></p> </div> PHP {literal} <script> function show_s1_{/literal}{$us.id}{literal}() { document.getElementById('s1_{/literal}{$us.id}{literal}').style.display='block'; document.getElementById('s2_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s3_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s4_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s5_{/literal}{$us.id}{literal}').style.display='none'; } //---------------- function show_s2_{/literal}{$us.id}{literal}() { document.getElementById('s1_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s2_{/literal}{$us.id}{literal}').style.display='block'; document.getElementById('s3_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s4_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s5_{/literal}{$us.id}{literal}').style.display='none'; } //---------------- function show_s3_{/literal}{$us.id}{literal}() { document.getElementById('s1_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s2_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s3_{/literal}{$us.id}{literal}').style.display='block'; document.getElementById('s4_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s5_{/literal}{$us.id}{literal}').style.display='none'; } //---------------- function show_s4_{/literal}{$us.id}{literal}() { document.getElementById('s1_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s2_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s3_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s4_{/literal}{$us.id}{literal}').style.display='block'; document.getElementById('s5_{/literal}{$us.id}{literal}').style.display='none'; } //---------------- function show_s5_{/literal}{$us.id}{literal}() { document.getElementById('s1_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s2_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s3_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s4_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s5_{/literal}{$us.id}{literal}').style.display='block'; } /////////////////////////////////////////////////// function hide_s1_{/literal}{$us.id}{literal}(){ document.getElementById('s1_{/literal}{$us.id}{literal}').style.display='block'; document.getElementById('s2_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s3_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s4_{/literal}{$us.id}{literal}').style.display='none'; document.getElementById('s5_{/literal}{$us.id}{literal}').style.display='none'; } function process_{/literal}{$us.id}{literal}() { if ( rateDoc.readyState != 4 ) return ; document.getElementById("small_rate_{/literal}{$us.id}{literal}").innerHTML = rateDoc.responseText ; } var rateDoc = null ; function load5_{/literal}{$us.id}{literal}() { if (typeof window.ActiveXObject != 'undefined' ) { rateDoc = new ActiveXObject('Microsoft.XMLHTTP'); rateDoc.onreadystatechange = process_{/literal}{$us.id}{literal} ; } else { rateDoc = new XMLHttpRequest(); rateDoc.onload = process_{/literal}{$us.id}{literal} ; } rateDoc.open( 'GET', '/ajax_page/ajax_users_rate.php?id={/literal}{$us.id}{literal}&task=plus_rate&rate=5', true ); rateDoc.send( null ); } function load4_{/literal}{$us.id}{literal}() { if (typeof window.ActiveXObject != 'undefined' ) { rateDoc = new ActiveXObject('Microsoft.XMLHTTP'); rateDoc.onreadystatechange = process_{/literal}{$us.id}{literal} ; } else { rateDoc = new XMLHttpRequest(); rateDoc.onload = process_{/literal}{$us.id}{literal} ; } rateDoc.open( 'GET', '/ajax_page/ajax_users_rate.php?id={/literal}{$us.id}{literal}&task=plus_rate&rate=4', true ); rateDoc.send( null ); } function load3_{/literal}{$us.id}{literal}() { if (typeof window.ActiveXObject != 'undefined' ) { rateDoc = new ActiveXObject('Microsoft.XMLHTTP'); rateDoc.onreadystatechange = process_{/literal}{$us.id}{literal} ; } else { rateDoc = new XMLHttpRequest(); rateDoc.onload = process_{/literal}{$us.id}{literal} ; } rateDoc.open( 'GET', '/ajax_page/ajax_users_rate.php?id={/literal}{$us.id}{literal}&task=plus_rate&rate=3', true ); rateDoc.send( null ); } function load2_{/literal}{$us.id}{literal}() { if (typeof window.ActiveXObject != 'undefined' ) { rateDoc = new ActiveXObject('Microsoft.XMLHTTP'); rateDoc.onreadystatechange = process_{/literal}{$us.id}{literal} ; } else { rateDoc = new XMLHttpRequest(); rateDoc.onload = process_{/literal}{$us.id}{literal} ; } rateDoc.open( 'GET', '/ajax_page/ajax_users_rate.php?id={/literal}{$us.id}{literal}&task=plus_rate&rate=2', true ); rateDoc.send( null ); } function load1_{/literal}{$us.id}{literal}() { if (typeof window.ActiveXObject != 'undefined' ) { rateDoc = new ActiveXObject('Microsoft.XMLHTTP'); rateDoc.onreadystatechange = process_{/literal}{$us.id}{literal} ; } else { rateDoc = new XMLHttpRequest(); rateDoc.onload = process_{/literal}{$us.id}{literal} ; } rateDoc.open( 'GET', '/ajax_page/ajax_users_rate.php?id={/literal}{$us.id}{literal}&task=plus_rate&rate=1', true ); rateDoc.send( null ); } </script> {/literal} <div class="mt-3 mb-3" style='width:100px; height:auto;'> <div id='s1_{$us.id}'> <div id='div_s1' onmouseover='show_s1_{$us.id}();' onclick='load1_{$us.id}();'> </div> <div id='div_s2' onmouseover='show_s2_{$us.id}();'> </div> <div id='div_s3' onmouseover='show_s3_{$us.id}();'> </div> <div id='div_s4' onmouseover='show_s4_{$us.id}();'> </div> <div id='div_s5' onmouseover='show_s5_{$us.id}();'> </div> <img src='/images/stars/s1.png' alt='s1' class='' width='100'/> </div> <div id='s2_{$us.id}' style='display:none;'> <div id='div_s1' onmouseover='show_s1_{$us.id}();'> </div> <div id='div_s2' onmouseover='show_s2_{$us.id}();' onclick='load2_{$us.id}();'> </div> <div id='div_s3' onmouseover='show_s3_{$us.id}();'> </div> <div id='div_s4' onmouseover='show_s4_{$us.id}();'> </div> <div id='div_s5' onmouseover='show_s5_{$us.id}();'> </div> <img src='/images/stars/s2.png' alt='s2' class='' width='100'/> </div> <div id='s3_{$us.id}' style='display:none;'> <div id='div_s1' onmouseover='show_s1_{$us.id}();'> </div> <div id='div_s2' onmouseover='show_s2_{$us.id}();'> </div> <div id='div_s3' onmouseover='show_s3_{$us.id}();' onclick='load3_{$us.id}();'> </div> <div id='div_s4' onmouseover='show_s4_{$us.id}();'> </div> <div id='div_s5' onmouseover='show_s5_{$us.id}();'> </div> <img src='/images/stars/s3.png' alt='s3' class='' width='100'/> </div> <div id='s4_{$us.id}' style='display:none;'> <div id='div_s1' onmouseover='show_s1_{$us.id}();'> </div> <div id='div_s2' onmouseover='show_s2_{$us.id}();'> </div> <div id='div_s3' onmouseover='show_s3_{$us.id}();'> </div> <div id='div_s4' onmouseover='show_s4_{$us.id}();' onclick='load4_{$us.id}();'> </div> <div id='div_s5' onmouseover='show_s5_{$us.id}();'> </div> <img src='/images/stars/s4.png' alt='s4' class='' width='100'/> </div> <div id='s5_{$us.id}' style='display:none;'> <div id='div_s1' onmouseover='show_s1_{$us.id}();'> </div> <div id='div_s2' onmouseover='show_s2_{$us.id}();'> </div> <div id='div_s3' onmouseover='show_s3_{$us.id}();'> </div> <div id='div_s4' onmouseover='show_s4_{$us.id}();'> </div> <div id='div_s5' onmouseover='show_s5_{$us.id}();' onclick='load5_{$us.id}();'> </div> <img src='/images/stars/s5.png' alt='s5' class='' width='100'/> </div> <p class="w-100 mt-2"><b>{$all_lang[97]}:</b> <span id='small_rate_{$us.id}' name='small_rate_{$us.id}'>{$us.rate}</span></p> </div> Делаю рейтинг у себя на сайте. Принцип работы простой, нажал на звездочку рейтинг поднялся всего 5 звёздочек, он работает исправно но валидатор выдаёт ошибку из-за неуникальности id Ниже прилагаю скриншот ошибок
<div id='div_s2_{$us.id}' onmouseover='show_s2_{$us.id}();'> </div> Код <div id='div_s2_{$us.id}' onmouseover='show_s2_{$us.id}();'> </div>