如何使用div的后退按钮

时间:2015-03-09 08:50:34

标签: jquery jsp

正如我前一个问题的变化所示,我使用div命令改变了我的整个代码。我的源代码如下:

<HTML>
<HEAD>
<TITLE>
</TITLE>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>

</HEAD>

<BODY>
<H1></H1>
<script language="JavaScript">
function NextData(ctrr)

{
 switch (ctrr) {
    case 1:
        $("a").hide();
        $("INPUT").hide();


        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(1)">Spotlight</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(2)">Simply the Best</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(3)">Juke box</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(4)">100 Greatest Album/Single</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(5)">List All Artists</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(6)">List All Albums</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(7)">Arabic</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(8)">Hindi</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(9)">Pop</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(10)">Rock</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(11)">Jazz & Blues</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(12)">Country</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(13)">Classical</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(14)">Dance</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(15)">Easy Listening</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(16)">World Music</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(17)">Relaxation</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(18)">Malayalam</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(19)">Tamil</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(20)">Far East</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(21)">Oryx Radio</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<A HREF ="javascript:Data(22)">Audio Book</A>');
        $('#myDiv').append('</td></tr></table>');

        $('#myDiv').append('<table><tr><td>');
        $('#myDiv').append('<INPUT TYPE="button" VALUE="Back" onClick="history.go(-1);">');

        break;

    case 2:
         alert("function 3");
        break;

 }
}

</script>
<script>


function displayData(ctr) {

switch (ctr) {

case 1:
$("a").hide();


$('#myDiv').append('<table><tr><td>');
$('#myDiv').append('<A HREF ="javascript:NextData(1)">Spotlight</A>');
$('#myDiv').append('</td></tr></table>');

$('#myDiv').append('<table><tr><td>');
$('#myDiv').append('<A HREF ="javascript:NextData(2)">Oryx highlights</A>');
$('#myDiv').append('</td></tr></table>');

$('#myDiv').append('<table><tr><td>');
$('#myDiv').append('<A HREF ="javascript:NextData(3)">Little Taster</A>');
$('#myDiv').append('</td></tr></table>');

$('#myDiv').append('<table><tr><td>');
$('#myDiv').append('<INPUT TYPE="button" VALUE="Back" onClick="history.go(-1);">');
 $('#myDiv').append('</td></tr></table>');
break;

case 2:
$("a").hide();


$('#myDiv').append("<table> <tr> <td>");
$('#myDiv').append('<A HREF = "#" ONCLICK="abc(1)">Spotlight</A>');
$('#myDiv').append(" </td></tr></table> ");

$('#myDiv').append("<table> <tr> <td>");
$('#myDiv').append('<A HREF = "#" ONCLICK="abc(2)">Oryx highlights</A>');
$('#myDiv').append(" </td></tr></table> ");

$('#myDiv').append("<table> <tr> <td>");
$('#myDiv').append('<A HREF = "#" ONCLICK="abc(3)">Little Taster</A>');
$('#myDiv').append(" </td></tr></table> ");


 break;
case 3:
alert("aaa");
break;

}

}


</script>

 <TABLE>


        <TR>
           <TD>

               <a onclick="displayData(1)" href="#">Broadcast Video</a>
           </TD> 
        </TR>

        <TR>
           <TD>

               <a onclick="displayData(2)" href="#">Interactive Audio</a>
           </TD> 
        </TR>

        <TR>
           <TD>

               <a onclick="displayData(3)" href="#">Interactive Movies</a>
           </TD> 
        </TR>

        <TR>
           <TD>

               <a onclick="displayData(4)" href="#">Trailers</a>
           </TD> 
        </TR>

        <TR>
           <TD>

               <a onclick="displayData(5)" href="#">Interactive Trailers</a>
           </TD> 
        </TR>

        <TR>
           <TD>

               <a onclick="displayData(6)" href="#">Interactive Shorts</a>
           </TD> 
        </TR>

        <TR>
           <TD>

               <a onclick="displayData(7)" href="#">PA</a>
           </TD> 
        </TR>

        <TR>
           <TD>

               <a onclick="displayData(8)" href="#">Young Travellers</a>
           </TD> 
        </TR>

        <TR>
           <TD>

               <a onclick="displayData(9)" href="#">MISC</a>
           </TD> 
        </TR>

        <TR>
           <TD>

               <a onclick="displayData(10)" href="#">Games</a>
           </TD> 
        </TR>



 </TABLE>

<div id="myDiv"></div>

</BODY>

</HTML>

我遇到的唯一问题是后退按钮无效。谁能告诉我如何启用单击后退按钮时隐藏的数据?

0 个答案:

没有答案