JavaScript 文本未提交表单答案

【问题标题】：JavaScript Text not submitting formJavaScript 文本未提交表单
【发布时间】：2015-07-09 23:44:51
【问题描述】：

我正在开发我的第一个 Web 应用程序，我正在尝试使用 javascript 通过单击文本来提交表单。当我单击文本时，没有任何反应。它现在应该只打开一个简单的网页。我知道如何使用 html 处理表单，但是当我尝试使用 javascript 时，什么也没有发生。我正在使用 unix，我已经配置了我的服务器和 chmod 755 的 cgi 文件。我不是这不是服务器错误，因为我之前已经在它上面执行过 cgi 文件。我正在关注本教程： http://www.thesitewizard.com/archive/textsubmit.shtml

这是我的测试 html：

<html>
<head>
    <title>EDVT Report Generator</title>
    <style>
        h1 {
            text-align: center;
        }
        <script language="JavaScript" type="text/javascript">

            function getsupport ( selectedtype )
            {
              document.supportform.supporttype.value = selectedtype ;
              document.supportform.submit() ;
            }

        </script>
    </style>
</head>
<body>
    <h1 id = "title">Test</h1>
    <form name="supportform" method="post" action="/cgi-bin/hello.py">
        <input type="hidden" name="supporttype" />
        <a href="javascript:getsupport('Paid')" onclick = "getsupport('Paid')">Paid Support</a> or
        <a href="javascript:getsupport('Free')" onclick = "getsupport('Free')">Free Support</a>
    </form>
</body>
</html>

这是cgi文件：

#!/usr/bin/python

import cgitb, cgi
cgitb.enable()

print "Content-type:text/html\r\n\r\n"
print '<html>'
print '<head>'
print '<title>Hello Word - First CGI Program</title>'
print '</head>'
print '<body>'
print '<h2>Hello Word! This is my first CGI program</h2>'
print '</body>'
print '</html>'

我完全不知道哪里出了问题，因为我对 javascript 没有太多经验。任何帮助表示赞赏！

【问题讨论】：

您的脚本位于<style> 标签内，因此没有脚本。在任何浏览器中查看错误控制台都会显示 getsupport 未定义
不要将getsupport('Paid') 放在href 和onclick 中。这将运行两次。
哇，谢谢！但是在我必须更长的实际代码中，这不是问题。我的脚本超出了样式标签，但它仍然不起作用
如果你们中的任何人想帮助解决实际问题，我将其发布在这里：stackoverflow.com/questions/31330981/…

标签： javascript php jquery html forms

【解决方案1】：

您不能在<style> 中嵌套<script>元素，唯一允许的内容是CSS。参见例如the MDN docs.

将<script> 移动到<head> 或<body>：

<html>
<head>
    <title>EDVT Report Generator</title>
    <style>
        h1 {
            text-align: center;
        }
    </style>
</head>
<body>
    <script language="JavaScript" type="text/javascript">

            function getsupport ( selectedtype )
            {
              document.supportform.supporttype.value = selectedtype ;
              document.supportform.submit() ;
            }

     </script>
    <h1 id = "title">Test</h1>
    <form name="supportform" method="post" action="/cgi-bin/hello.py">
        <input type="hidden" name="supporttype" />
        <a href="javascript:getsupport('Paid')" onclick = "getsupport('Paid')">Paid Support</a> or
        <a href="javascript:getsupport('Free')" onclick = "getsupport('Free')">Free Support</a>
    </form>
</body>
</html>

【讨论】：