알파벳 순서로 클릭하는 방법?

Question

나는 코딩에 새롭기 때문에 나는 아래의 코드를 어떻게 만들 수 있는지 물어보고 싶다. 물고기는 '알파벳'순서로만 클릭 할 수 있는데, 'A'는 먼저 클릭 할 수 있고 다른 물고기는 ' A '를 클릭하면 사라지지 않습니다. 그것을하는 방법이 있습니까?

<?xml version='1.0' standalone='no'?> 
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" 
    "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> 

<svg width='100%' height='100%' xmlns='http://www.w3.org/2000/svg' onload='Init(evt)'> 
    <title>Fish Game</title> 
    <script type='text/ecmascript'><![CDATA[ 
     var SVGDocument = null; 
     var SVGRoot = null; 

     function Init(evt) 
     { 
     SVGDocument = evt.target.ownerDocument; 
     SVGRoot = SVGDocument.documentElement; 
     } 

     function ToggleOpacity(evt, targetId) 
     { 
     var newTarget = evt.target; 

     if (targetId) 
     { 
      newTarget = SVGDocument.getElementById(targetId); 
     } 

     var newValue = newTarget.getAttributeNS(null, 'opacity') 

     if ('0' != newValue) 
     { 
      newValue = '0'; 
     } 
     else 
     { 
      newValue = '1'; 
     } 

     newTarget.setAttributeNS(null, 'opacity', newValue); 

     if (targetId) 
     { 
      SVGDocument.getElementById(targetId + 'Exception').setAttributeNS(null, 'opacity', '1'); 
     } 
     } 
    ]]></script> 

<?php 
    mysql_connect("localhost", "root", "") or die(mysql_error()); 
    mysql_select_db("db") or die(mysql_error()); 
    static $data; 
    $data = mysql_query("SELECT * FROM alphabet;") 
    or die(mysql_error()); 

    while($info = mysql_fetch_array($data)) { 
?> 
<text x="20" y="20" style="font-family:Times,serif;fill:#B40404;font-size:20px">please find the letter:</text> 

//fish body 
<g id='<?php print $info['ID']; ?>' onclick='ToggleOpacity(evt, "<?php print $info['ID']; ?>")'> 
<circle cx="<?php print $info['body_cx']; ?>"cy="<?php print $info['body_cy']; ?>" r="<?php print $info['body_r']; ?>" stroke="black" stroke-width="1" fill="<?php print $info['body_fill']; ?>" /> 

//tail 
<path d="<?php print $info['tail']; ?>" fill="<?php print $info['tail_fill']; ?>" stroke="<?php print $info['tail_stroke']; ?>" stroke-width="1" /> 

//eye 
<circle cx="<?php print $info['eye_cx']; ?>" cy="<?php print $info['eye_cy']; ?>" r="<?php print $info['eye_r']; ?>" stroke="black" stroke-width="1" fill="<?php print $info['eye_fill' ];?>" /> 
<circle cx="<?php print $info['pupil_cx']; ?>" cy="<?php print $info['pupil_cy']; ?>" r="<?php print $info['pupil_r']; ?>" stroke="black" stroke-width="1 " /> 

//'A' 
    <text x="<?php print $info['al_x']; ?>" y="<?php print $info['al_y']; ?>" style="font-family:Times,serif;fill:#B40404;font-size:<?php print $info['size']; ?>"><?php print $info['Alphabet']; ?></text> 

    <animateMotion 
     from="<?php print $info['from']; ?>" to="<?php print $info['to']; ?>" 
     dur="<?php print $info['duration']; ?>" repeatCount="indefinite" /> 
    </g> 
    <?php 
    } 
?> 
</svg> 

Answer 1

SELECT * 
FROM `alphabet` 
ORDER BY `Alphabet` ASC