stackoom
  简体   繁体   中英

How to call javascript function from javascript

 原文  2015-03-05 09:59:45  9   4    javascript/ jsp

Question

I am stucked in the middle of my code and need help. I am creating a web application using jsp. Here is my code: 

<%@include file="dbconnection.jsp"%>

<HTML>
<HEAD>
    <TITLE></TITLE>
</HEAD>
<BODY>
    <H1></H1>
    <script language="JavaScript">
 function showdata(ctr) {
 switch (ctr) {
case 1:
    <%ResultSet rs = statement.executeQuery("select value from Authors;") ;  %>
    <% 
    int c=0;
     while(rs.next()){ 
        String result=rs.getString(1);
        c++;
    %>
    document.write('<table><tr><td>');
    document.write('<A HREF = "#" ONCLICK="Nextdata(<%=c%>)"><%=result%></A>');
    document.write('</td></tr></table>');
    <% } %>
    document.write('<INPUT TYPE="button" VALUE="Back" onClick="history.go(-1);">');
    break;
case 2:
    alert("xyz");
     break;
     }
}
function Nextdata(count)
{
 switch (count) {
    case 1:
         alert("Hi");
        break;
 }
}
</script>
 <TABLE>
           <%ResultSet resultset = statement.executeQuery("select title from Books;") ;%>
            <% 
            int counter=0;
             while(resultset.next()){ 
                String result=resultset.getString(1);
                counter++;
            %>
            <TR>
               <TD>
                   <a href="javascript:showdata(<%=counter%>)"><%=result%></a>
               </TD> 
            </TR>
            <% } %>
  </TABLE>
</BODY>
</HTML>

When i click on a particular link then showdata function gets called after that i am clicking on another link for which the code is written inside showdata() to call Nextdata() function. But this Nextdata function doesn't get called why so? where is my mistake? Please help.

4 answers

solution1
 0  2015-03-05 10:12:46

You just cant nest the javascript functions, unless and until you are sure that the nested function 'NextData()' is not going be used outside the scope of 'ShowData()' function.

Just try to put the 'NextData()' outside the scope of 'ShowData()'

This may work out for you..!!

solution2
 0  2015-03-05 10:56:50

When i run jsp my source is: 

<HTML>
<HEAD>
    <TITLE>
    </TITLE>

</HEAD>

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

{
 switch (ctrr) {
    case 1:
         alert("function 3");
        break;
    case 2:
         alert("function 3");
        break;
    case 3:
        alert("function 3");
         break;
     case 4:
         alert("function 4");
          break;
     case 5:
         alert("function 5");
          break;
 }
}

</script>
    <script language="JavaScript">


function displayData(ctr) {



 switch (ctr) {
case 1:



    document.write('<table><tr><td>');
    document.write('<A HREF ="javascript:NextData(1)">Spotlight</A>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<A HREF ="javascript:NextData(2)">Oryx highlights</A>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<A HREF ="javascript:NextData(3)">Little Taster</A>');
    document.write('</td></tr></table>');

    document.write('<INPUT TYPE="button" VALUE="Back" onClick="history.go(-1);">');



    break;
case 2:


    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(1)">Spotlight</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(2)">Simply the Best</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(3)">Juke box</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(4)">100 Greatest Album/Single</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(5)">List All Artists</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(6)">List All Albums</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(7)">Arabic</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(8)">Hindi</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(9)">Pop</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(10)">Rock</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(11)">Jazz & Blues</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(12)">Country</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(13)">Classical</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(14)">Dance</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(15)">Easy Listening</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(16)">World Music</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(17)">Relaxation</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(18)">Malayalam</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(19)">Tamil</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(20)">Far East</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(21)">Oryx Radio</a>');
    document.write('</td></tr></table>');

    document.write('<table><tr><td>');
    document.write('<a href="JavaScript:NextData(22)">Audio Book</a>');
    document.write('</td></tr></table>');

    document.write('<INPUT TYPE="button" VALUE="Back" onClick="history.go(-1);">');
     break;
case 3:
   alert("function 3");
    break;
case 4:
    alert("function 4");
     break;
case 5:
    alert("function 5");
     break;
case 6:
    alert("function 6");
     break;
case 7:
    alert("function 7");
     break;
case 8:
    alert("function 8");
     break;
case 9:
    alert("function 9");
     break;
case 10:
    alert("function 10");
     break;
     }

}


</script>


 <TABLE>


            <TR>
               <TD>
                   <a href="javascript:displayData(1)">Broadcast Video</a>
               </TD> 
            </TR>

            <TR>
               <TD>
                   <a href="javascript:displayData(2)">Interactive Audio</a>
               </TD> 
            </TR>

            <TR>
               <TD>
                   <a href="javascript:displayData(3)">Interactive Movies</a>
               </TD> 
            </TR>

            <TR>
               <TD>
                   <a href="javascript:displayData(4)">Trailers</a>
               </TD> 
            </TR>

            <TR>
               <TD>
                   <a href="javascript:displayData(5)">Interactive Trailers</a>
               </TD> 
            </TR>

            <TR>
               <TD>
                   <a href="javascript:displayData(6)">Interactive Shorts</a>
               </TD> 
            </TR>

            <TR>
               <TD>
                   <a href="javascript:displayData(7)">PA</a>
               </TD> 
            </TR>

            <TR>
               <TD>
                   <a href="javascript:displayData(8)">Young Travellers</a>
               </TD> 
            </TR>

            <TR>
               <TD>
                   <a href="javascript:displayData(9)">MISC</a>
               </TD> 
            </TR>

            <TR>
               <TD>
                   <a href="javascript:displayData(10)">Games</a>
               </TD> 
            </TR>


  </TABLE>
</BODY>
</HTML>

And on clicking on link i get this as source: 

<table><tr><td><a href="javascript:NextData(1)">Spotlight</a></td></tr></table><table><tr><td><a href="javascript:NextData(2)">Simply the Best</a></td></tr></table><table><tr><td><a href="javascript:NextData(3)">Juke box</a></td></tr></table><table><tr><td><a href="javascript:NextData(4)">100 Greatest Album/Single</a></td></tr></table><table><tr><td><a href="javascript:NextData(5)">List All Artists</a></td></tr></table><table><tr><td><a href="javascript:NextData(6)">List All Albums</a></td></tr></table><table><tr><td><a href="javascript:NextData(7)">Arabic</a></td></tr></table><table><tr><td><a href="javascript:NextData(8)">Hindi</a></td></tr></table><table><tr><td><a href="javascript:NextData(9)">Pop</a></td></tr></table><table><tr><td><a href="javascript:NextData(10)">Rock</a></td></tr></table><table><tr><td><a href="javascript:NextData(11)">Jazz & Blues</a></td></tr></table><table><tr><td><a href="javascript:NextData(12)">Country</a></td></tr></table><table><tr><td><a href="javascript:NextData(13)">Classical</a></td></tr></table><table><tr><td><a href="javascript:NextData(14)">Dance</a></td></tr></table><table><tr><td><a href="javascript:NextData(15)">Easy Listening</a></td></tr></table><table><tr><td><a href="javascript:NextData(16)">World Music</a></td></tr></table><table><tr><td><a href="javascript:NextData(17)">Relaxation</a></td></tr></table><table><tr><td><a href="javascript:NextData(18)">Malayalam</a></td></tr></table><table><tr><td><a href="javascript:NextData(19)">Tamil</a></td></tr></table><table><tr><td><a href="javascript:NextData(20)">Far East</a></td></tr></table><table><tr><td><a href="javascript:NextData(21)">Oryx Radio</a></td></tr></table><table><tr><td><a href="javascript:NextData(22)">Audio Book</a></td></tr></table><INPUT TYPE="button" VALUE="Back" onClick="history.go(-1);">

solution3
 0  2015-03-05 11:02:48

Your defined function name is Nextdata() and your generated HTML is calling a function Next D ata()

Check is this is the error?

In your browser console check if your are getting "Uncaught ReferenceError: NextData is not defined"

solution4
 0  2015-03-05 12:41:27

I took the time to investigate the issue and found out -in this case thanks to Internet Explorer- the reason. Also it confirmed my comment in answer two (it came from op himself):

When you executes document.write() the IE and FF generate a new blank page. The effect is that the javascript function NextData() does not exists. Are it really sure that both browsers creates a new page? Yes, because history.goBack(-1) does work and show the first view again. So the browsers are unable to execute a non existing function.

Any solution?: Maybe...

One way to solve this issue is create two div elements, that contains the first table and second one contains the appended target table. The hide the first and show the second. Javascript: AppendChild will help you to understand what I meant.

PS: There exists more than one way to solve this, but do never ever use document.write() . As you can see, this method shows in some browsers unexpected behavior.

暂无
暂无

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

Related Question how to call a javascript function from another javascript? How to call vuejs function from javascript function? how to call javascript function from SmartGWT function how to call JSNI function from Javascript function? How to call a function from a function argument in JavaScript? How to call function in javascript How to call a javascript function? how to call javascript function? JavaScript, how to call a function How to call this function in Javascript?
Related Tags
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM