Question

我在外部java脚本文件中有一个函数，我不知道如何调用并返回我的函数在文本中正确返回的值。当我点击下订单时，我想要通过我的函数计算值，然后在场所订单框下面显示最终值。如果我什么都不输，我可以让我的功能发出警报，但是我无法让它返回我的最终价值 - 我做错了什么？

＆＃13;

function sum2()
{
      var one = document.getElementById("book_1").value;
      var two = document.getElementById("book_2").value;
      var three = document.getElementById("book_3").value;

      if ((one == "")||(two == "")||(three == ""))
      {
        alert ('Error', 'values missing');
      }
      else
      {
         var sum1 = one * 19.99;
         var sum2 = two * 86.00;
         var sum3 = three * 55.00;
         var sum = sum1 + sum2 + sum3;

         document.getElementById('output').value = sum;
         document.write(sum);
}

＆＃13;

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>Work</title>
    <script type="text/javascript" src="ex4.js"></script>
  </head>
  <body>
     <div id="container">
     <h2>Order Books Online</h2>
     <form action="" method="post" id=”frm”>
       <fieldset>
       <table border="0">
         <tr>
           <th>Book</th>
           <th>Quantity</th>
           <th>Price</th>
         </tr>
         <tr>
           <td>Basics of C++</td>
           <td><input type="text" size="3" id="book_1" /></td>
           <td>$19.99</td>
         </tr>
         <tr>
           <td>Program Development in Perl</td>
           <td><input type="text" size="3" id="book_2" /></td>
           <td>$86.00</td>
         </tr>
         <tr>
           <td>Advanced JavaScript</td>
           <td><input type="text" size="3" id="book_3" /></td>
           <td>$55.00</td>
         </tr>
       </table>
       <br /><br />
       <input type="submit" onclick="sum2(); return false;" value="Place Order" id="sub" />
       </fieldset>
      </form>
     </div>
  </body>
</html>

＆＃13;

Answer 1

试试这个，它的工作，输出显示在最后。

＆＃13;

function sum2()
{
      var one = document.getElementById("book_1").value;
      var two = document.getElementById("book_2").value;
      var three = document.getElementById("book_3").value;

      if ((one == "")||(two == "")||(three == ""))
      {
        alert ('Error', 'values missing');
      }
      else
      {
         var sum1 = one * 19.99;
         var sum2 = two * 86.00;
         var sum3 = three * 55.00;
         var sum = sum1 + sum2 + sum3;

         document.getElementById('output').innerHTML = sum;
        // document.write(sum);
        }
}

＆＃13;

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>Work</title>
    <script type="text/javascript" src="ex4.js"></script>
  </head>
  <body>
     <div id="container">
     <h2>Order Books Online</h2>
     <form action="" method="post" id=”frm”>
       <fieldset>
       <table border="0">
         <tr>
           <th>Book</th>
           <th>Quantity</th>
           <th>Price</th>
         </tr>
         <tr>
           <td>Basics of C++</td>
           <td><input type="text" size="3" id="book_1" /></td>
           <td>$19.99</td>
         </tr>
         <tr>
           <td>Program Development in Perl</td>
           <td><input type="text" size="3" id="book_2" /></td>
           <td>$86.00</td>
         </tr>
         <tr>
           <td>Advanced JavaScript</td>
           <td><input type="text" size="3" id="book_3" /></td>
           <td>$55.00</td>
         </tr>
       </table>
       <br /><br />
       <input type="submit" onclick="sum2(); return false;" value="Place Order" id="sub" />
       </fieldset>
      </form>
     </div>
    <div id="output"></div>
  </body>
</html>

＆＃13;

Answer 2

使用document.write()似乎并不是您想要的。（而且，老实说，无论如何都应该避免。）

但是，将做你想做的事情：

document.getElementById('output').value = sum;

所有您需要的是一个HTML input元素，其中id（您的HTML目前缺少该元素）：

<input type="text" id="output" />

（此外，您的JavaScript缺少结束}，这是语法错误。）

获得该HTML元素并删除document.write()调用后，应正确输出该值。

如果您希望输出的内容不是另一个input元素，那么您将不会使用.value，而是更像.innerHTML的内容：

document.getElementById('output').innerHTML = sum;

包含如下元素：

<span id="output"></span>

作为术语的一边，这不是＆＃34;返回＆＃34;函数的值。＆＃34;返回＆＃34;当涉及函数时，它具有非常特定的含义，当函数本身使用return关键字生成值时，将该值传递回堆栈中的函数调用该函数。

此函数正在为HTML写一个值，但它没有返回任何内容。

如何从外部javascript函数

2 个答案: