-1

我已经完成了所有的编码,一切正常。只停留在javascript中。我可以更改图像背景的颜色。但是,单击图像时无法提示弹出消息,我尝试使用“onclick”。但它仍然不起作用。

任何人都可以给我建议或工作示例。请在下面查看我的编码-

<html> 
<head> 
<style> 
            th{ 
                width:60px; 
                height:60px; 
            } 
            table{ 
                border: 5px solid #FFBB78; 
                border-collapse:collapse; 
            } 
            td{ 
                width:60px; 
                height:60px; 
            } 
            tr{ 
                width:60px; 
                height:60px;  
            } 
            h1{ 
                color:#6633FF; 
            } 
</style> 

<script type="text/javascript"> 
function changeColor(){
    document.getElementById("king").style.backgroundColor="black";
 }
 function click(){
     /*var pawn = document.write.getElementById('pawn');
     var knight = document.write.getElementById('knight');
     var queen = document.write.getElementById('queen');
     var bishop = document.write.getElementById('bishop');
     var king = document.write.getElementById('king_1');
     var square = document.write.getElementById('sqaure');*/
     alert("This is a knight");
 }

 /*function promt_chess_piece(){
    //var knight = document.write.getElementById('knight');
    if (knight.value.lenght)
    {
        alert("This is the knight");
        knight.focus();
        return true;
    }
 }*/
</script> 
</head> 
<body> 
<?php 

    $pictures = array( 
        //row 1
        "1,1" => '<img src="chess/br.gif" />',  
        "1,3" => '<img src="chess/bb.gif"/>', 
        "1,4" => '<img src="chess/bq.gif"/>',
        "1,5" => '<img src="chess/bk.gif"/>',
        "1,8" => '<img src="chess/br.gif"/>',
        //row 2
        "2,1" => '<img src="chess/bp.gif"/>', 
        "2,2" => '<img src="chess/bp.gif"/>', 
        "2,3" => '<img src="chess/bp.gif"/>', 
        "2,4" => '<img src="chess/bp.gif"/>', 
        "2,5" => '<img src="chess/bb.gif"/>', 
        "2,6" => '<img src="chess/bp.gif"/>', 
        "2,7" => '<img src="chess/bp.gif"/>', 
        "2,8" => '<img src="chess/bp.gif"/>',

        //row 3
        "3,3" => '<img src="chess/bn.gif"  onclick="click()"/>',
        "3,6" => '<img src="chess/bn.gif"/>',

        //row 4
        "4,5" => '<img src="chess/bp.gif"/>',

        //row 5
        "5,3" => '<img src="chess/wb.gif"/>',
        "5,5" => '<img src="chess/wp.gif"/>',

        //row 6 
        "6,4" => '<img src="chess/wp.gif"/>',
        "6,6" => '<img src="chess/wn.gif"/>',

        //row 7
        "7,1" => '<img src="chess/wp.gif"/>',
        "7,2" => '<img src="chess/wp.gif"/>',
        "7,3" => '<img src="chess/wp.gif"/>',
        "7,6" => '<img src="chess/wp.gif"/>',
        "7,7" => '<img src="chess/wp.gif"/>',
        "7,8" => '<img src="chess/wp.gif"/>',

        //row 8
        "8,1" => '<img src="chess/wr.gif"/>',
        "8,2" => '<img src="chess/wn.gif"/>',
        "8,3" => '<img src="chess/wb.gif"/>',
        "8,4" => '<img src="chess/wq.gif"/>',
        "8,6" => '<img src="chess/wr.gif"/>',
        "8,7" => '<img src="chess/wk.gif" onmouseover="changeColor()" id="king" />',);//array ends here

    echo"<h1 align='center'>SAJID Chess Board</h1>"; 
    echo"<table border='1' align='center'>"; 

     for($i = 1; $i <= 8; $i++){      
          echo "<tr>"; 
          for($j = 1; $j <=8; $j++){ 
              if( ($i+$j)%2==0 ) { 
                echo"<td bgcolor='#99FF99'>"; 
              } 
              else { 
                echo"<td bgcolor='#9999CC'>"; 
                   } 


                if(isset($pictures["{$i},{$j}"]))//compares the pictures i and p 
                    echo $pictures["{$i},{$j}"]; 

                echo "</td>"; 
                } 
                echo "</tr>"; 
            } 


            echo "</table>"; 

        ?> 
    </body> 
</html> 
4

1 回答 1

0

你确定点击带有 onclick 属性的图片吗?只有一张图片有这个。这是我唯一能看到的可能是问题所在。

于 2012-05-25T21:44:48.970 回答