添加 jquery 时 HTML 代码不呈现答案

【问题标题】：HTML code doesn't render when jquery is added添加 jquery 时 HTML 代码不呈现
【发布时间】：2013-03-25 17:46:46
【问题描述】：

我在 JSP 页面中有以下 html，由于某种原因，如果在第一个 input type 之后添加了 <script type="text/javascript"> $("#department").autocomplete("department.jsp",{minChars: 4});，则其余字段不会出现在 Internet Explorer 8 中，但在 Firefox 和 Chrome 中确实会出现。

这可能是什么原因？

<table width="583" border="0">
      <tr>
        <td>Employee No:</td>
        <td> <input type="text" id="employee " name="employee " size="30">          
                 <script type="text/javascript">
        $("#department").autocomplete("department.jsp");
           </script></td>
      </tr>

以下代码无法在 IE 8 中呈现

      <tr>
        <td>Join Date </td>
        <td>
        <input type="text" id="jdate" name="jdate" size="30"/></td>
      </tr>
      <tr>
        <td>Contracrt </td>
        <td><input type="text" id="cont" name="cont" size="30"/></td>
      </tr>         
    </table>

编辑 1

完整的 HTML 代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%@ page contentType="text/html;charset=windows-1252"%>
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
 <html><head>
 <link rel="stylesheet" type="text/css" href="css/jquery.autocomplete.css" />
    <script type="text/javascript"
            src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script src="js/jquery.autocomplete.js" type="text/javascript"></script>    

    </head>
    <body>
    <p>
      <f:view>
        <h:form id="employeefrm">
   <table width="583" border="0">
      <tr>
        <td>Employee No:</td>
        <td> <input type="text" id="employee " name="employee " size="30">          
                 <script type="text/javascript">
        $("#department").autocomplete("department.jsp");
           </script></td>
      </tr>
      <tr>
        <td>Join Date </td>
        <td>
        <input type="text" id="jdate" name="jdate" size="30"/></td>
      </tr>
      <tr>
        <td>Contracrt </td>
        <td><input type="text" id="cont" name="cont" size="30"/></td>
      </tr>         
    </table>

    <p>&nbsp;</p>
     </h:form>
      </f:view>
    </body>
</html>

编辑 2

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"> 
 <html><head>
 <link rel="stylesheet" type="text/css" href="css/jquery.autocomplete.css" />
    <script type="text/javascript"
            src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script src="js/jquery.autocomplete.js" type="text/javascript"></script>             
    </head>
    <body>
    <p>

        <form id="employeefrm" method="post" action="emp.jsp" enctype="application/x-www-form-urlencoded">

    <table width="583" border="1">
      <tr>
        <td>Employee No:</td>
        <td> <input type="text" id="employee " name="employee " size="50">          
                 <script type="text/javascript">

      $("#department").autocomplete("department.jsp");

           </script></td>
      </tr>
      <tr>
        <td>Join Date </td>
        <td>
        <input type="text" id="jdate" name="jdate" size="30"/></td>
      </tr>
      <tr>
        <td>Contracrt  </td>
        <td><input type="text" id="cont" name="cont" size="30"/></td>
      </tr>      
    </table>         
          <p>&nbsp;</p>
     <input type="hidden" name="employeefrm" value="employeefrm" /></form>

    </body>
</html>

【问题讨论】：

请显示不起作用的代码，而不是起作用的代码。
@Juhana 我在我的问题中添加了不在 IE 8 中呈现的代码。
你html上的#department在哪里？
不，我的意思是显示一个完整的示例，其中包含使字段消失的 JavaScript 代码。这可能是因为 HTML 或 JavaScript 被破坏了，这就是为什么需要一个完整的例子。例如，您在 sn-p 中没有结束 </script> 标记。最好创建一个 jsfiddle 来显示问题。
@Juhana 我在我的问题中添加了完整的代码作为编辑 1。

标签： jquery html internet-explorer browser cross-browser

【解决方案1】：

试试这个：

 $(document).ready(function() {
 $("#department").autocomplete("department.jsp");});
}

放在前面

【讨论】：

不使用文档就绪会如何导致某些字段消失？