简体   繁体   English

如何从javascript调用javascript函数

[英]How to call javascript function from javascript

I am stucked in the middle of my code and need help. 我陷入了代码的中间,需要帮助。 I am creating a web application using jsp. 我正在使用jsp创建一个Web应用程序。 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. 当我点击一个特定的链接然后showdata函数被调用后,我点击另一个链接,其代码写在showdata()内调用Nextdata()函数。 But this Nextdata function doesn't get called why so? 但是这个Nextdata函数不会被调用为什么会这样? where is my mistake? 我的错在哪里? Please help. 请帮忙。

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. 你不能嵌套javascript函数,除非你确定嵌套函数'NextData()'不会在'ShowData()'函数的范围之外使用。

Just try to put the 'NextData()' outside the scope of 'ShowData()' 试着把'NextData()'放在'ShowData()'的范围之外

This may work out for you..!! 这可能对你有用.. !!

When i run jsp my source is: 当我运行jsp我的源代码是:

<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);">

Your defined function name is Nextdata() and your generated HTML is calling a function Next D ata() 您定义的函数名称是Nextdata(),您生成的HTML正在调用函数Next D ata()

Check is this is the error? 检查这是错误吗?

In your browser console check if your are getting "Uncaught ReferenceError: NextData is not defined" 在浏览器控制台中检查您是否收到“未捕获的ReferenceError:未定义NextData”

I took the time to investigate the issue and found out -in this case thanks to Internet Explorer- the reason. 我花时间调查问题并发现 - 在这种情况下感谢Internet Explorer - 原因。 Also it confirmed my comment in answer two (it came from op himself): 它也证实了我在回答二中的评论(来自op本人):

When you executes document.write() the IE and FF generate a new blank page. 当您执行document.write() ,IE和FF会生成一个新的空白页面。 The effect is that the javascript function NextData() does not exists. 结果是javascript函数NextData()不存在。 Are it really sure that both browsers creates a new page? 是否确实两个浏览器都创建了新页面? Yes, because history.goBack(-1) does work and show the first view again. 是的,因为history.goBack(-1)确实有效并再次显示第一个视图。 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. 解决此问题的一种方法是创建两个div元素,其中包含第一个表,第二个元素包含附加的目标表。 The hide the first and show the second. 隐藏第一个并显示第二个。 Javascript: AppendChild will help you to understand what I meant. Javascript:AppendChild将帮助您理解我的意思。

PS: There exists more than one way to solve this, but do never ever use document.write() . PS:解决这个问题的方法不止一种,但永远不要使用document.write() As you can see, this method shows in some browsers unexpected behavior. 如您所见,此方法在某些浏览器中显示意外行为。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM