首页 \ 问答 \ 关于IE7的IceFaces menuBar + menuItem显示错误(IceFaces menuBar + menuItem display bug on IE7)

关于IE7的IceFaces menuBar + menuItem显示错误(IceFaces menuBar + menuItem display bug on IE7)

 寻找一些小显示bug的帮助。 以下是使用IceFaces 2.0.2在JBoss 7.0.2.Final上运行的代码示例： 
 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:c="http://java.sun.com/jstl/core" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:ice="http://www.icesoft.com/icefaces/component">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>TEST</title>
<style>
  *{margin: 0;padding: 0;font-family: Helvetica, Arial, Verdana ;font-size: 12px;}
  .mainmenubar{width: 100%;height: 32px;background-color: blue;}
  .mainmenubarItem{float: left;height: 27px;border-right: 1px solid white;padding-top: 5px;}
  .mainmenubarItem a, .mainmenubarItem a:hover, .mainmenubarItem a span{color: white;font-size: 16px;font-weight: bold;text-decoration: none;}
  .mainmenubarSubMenu{position: absolute;background-color: #F5F5F5;}
  </style>
</h:head>
<h:body>
  <div style="background-color: grey; width: 100%; height: 50px;" />
    <ice:form id="menuform">
      <ice:menuBar styleClass="mainmenubar" orientation="horizontal">
        <ice:menuItem styleClass="mainmenuitem" id="mainmenu1" onclick="return false;" value="MENU1">
          <ice:menuItem value="SUBMENU1" styleClass="submenuitem" id="submenu1" onclick="return false;" />
          <ice:menuItem value="SUBMENU1" styleClass="submenuitem" id="submenu2" onclick="return false;" />
        </ice:menuItem>
        <ice:menuItem styleClass="mainmenuitem" id="mainmenu2" onclick="return false;" value="MENU2" />
      </ice:menuBar>
    </ice:form>
  <div class="bottom" style="background-color: yellow; width: 100%; height: 1800px;" />
</h:body>
</html>

 

 好像我无法直接上传附在此帖子上的文件来显示截图。 但是，您应该能够将此代码复制/粘贴到具有类似配置的任何IceFaces项目中，打开IE7版本（事实上我确实使用IE8激活了“兼容性视图”模式，想知道它是否有效果）。 
 

 如果您不滚动页面并将MENU1悬停，您将看到SUBMENU正确显示。 但是，如果您滚动一点页面以使菜单位于页面顶部并将菜单悬停在MENU1上，您将看到SUBMENU在菜单下显示约50px。 因此，你永远无法点击第二个菜单...... 
 

 无法弄清楚为什么这不起作用。 我看了一下http://component-showcase.icefaces.org/component-showcase/showcase.iface上的IceFaces展示，看到它在我的IE版本上工作（无法真正证明展示使用相同版本的IceFaces像我这样做）。 
 

 我做了一个额外的测试：在本地获取展示代码显示相同的行为（有bug）。 这是我正在运行的确切代码： 
 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:c="http://java.sun.com/jstl/core" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:ice="http://www.icesoft.com/icefaces/component">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>TEST</title>
<link rel="stylesheet" type="text/css" href="http://component-showcase.icefaces.org/component-showcase/xmlhttp/css/rime/rime.css" />
<link rel="stylesheet" type="text/css" href="http://component-showcase.icefaces.org/component-showcase/css/showcase_style.css" />
<link rel="stylesheet" type="text/css" href="http://component-showcase.icefaces.org/component-showcase/css/showcase_overrides.css" />
<link rel="stylesheet" type="text/css" href="http://component-showcase.icefaces.org/component-showcase/css/showcase_layout.css" />
</h:head>
<h:body>
   <ice:panelGroup styleClass="componentBox">

     <ice:panelGroup styleClass="synopsisBox menuBarContainer">
       <ice:outputText value="The menuBar component provides a robust menu system." />
       <ice:outputText value="In the box below, choose the orientation of the Menu Bar and then select a menu item. The backing been value of the selected item will be reflected under Server-side Backing Bean Values." />
     </ice:panelGroup>

     <ice:panelGroup styleClass="clearer" />

     <!-- main menu declaration  -->
     <ice:panelGroup styleClass="exampleBox menuBarContainer">
       <ice:menuBar id="menuBar" orientation="horizontal">
         <!-- File menu -->
         <ice:menuItem value="File" id="file" onclick="return false;">
           <ice:menuItem onclick="return false;" id="open" value="Open" icon="http://component-showcase.icefaces.org/component-showcase/images/menu/open.gif"></ice:menuItem>
           <ice:menuItem id="close" value="Close" onclick="return false;"></ice:menuItem>
           <ice:menuItem id="recent" value="Recent" icon="http://component-showcase.icefaces.org/component-showcase/images/menu/recent.gif" onclick="return false;">
             <ice:menuItem id="file1" value="File 1" onclick="return false;"></ice:menuItem>
            <ice:menuItem id="file2" onclick="return false;" value="File 2">
            <ice:menuItem id="para1" onclick="return false;" value="Para 1"></ice:menuItem>
              <ice:menuItem id="para2" value="Para 2" onclick="return false;"></ice:menuItem>
              <ice:menuItem id="para3" value="Para 3" onclick="return false;"></ice:menuItem>
            </ice:menuItem>
            <ice:menuItem value="File 3" id="file3" onclick="return false;"></ice:menuItem>
            <ice:menuItem value="File 4" id="file4" onclick="return false;"></ice:menuItem>
          </ice:menuItem>

          <ice:menuItem id="save" icon="http://component-showcase.icefaces.org/component-showcase/images/menu/save.gif" value="Save" onclick="return false;"></ice:menuItem>
          <ice:menuItemSeparator />
          <ice:menuItem id="print" icon="http://component-showcase.icefaces.org/component-showcase/images/menu/print.gif" value="Print" onclick="return false;"></ice:menuItem>

        </ice:menuItem>

        <!-- Edit menu -->
        <ice:menuItem value="Edit" id="edit" onclick="return false;">
          <ice:menuItem id="cut" value="Cut" onclick="return false;"></ice:menuItem>
          <ice:menuItem id="copy" value="Copy" onclick="return false;"></ice:menuItem>
          <ice:menuItem id="paste" value="Paste" onclick="return false;"></ice:menuItem>
        </ice:menuItem>

        <!-- View menu -->
        <ice:menuItem value="View" id="view" onclick="return false;">
          <ice:menuItem id="zoom_in" value="Zoom In" icon="http://component-showcase.icefaces.org/component-showcase/images/menu/zoomin.gif" onclick="return false;"></ice:menuItem>
          <ice:menuItem id="zoom_out" value="Zoom Out" icon="http://component-showcase.icefaces.org/component-showcase/images/menu/zoomout.gif" onclick="return false;"></ice:menuItem>
          <ice:menuItem id="fit_in_window" value="Fit In Window" icon="http://component-showcase.icefaces.org/component-showcase/images/menu/fitinwindow.gif" onclick="return false;"></ice:menuItem>
          <ice:menuItem id="actual_size" value="Actual Size" icon="http://component-showcase.icefaces.org/component-showcase/images/menu/actualsize.gif" onclick="return false;"></ice:menuItem>
        </ice:menuItem>

        <!-- Help Menu -->
        <ice:menuItem value="Help" id="help" onclick="return false;">
          <ice:menuItem id="docs" value="Documentation" icon="http://component-showcase.icefaces.org/component-showcase/images/menu/help.gif" link="http://www.icefaces.org/main/resources/documentation.iface" target="_blank" />
        </ice:menuItem>

      </ice:menuBar>
    </ice:panelGroup>

    <ice:panelGroup styleClass="clearer" />

  </ice:panelGroup>
  <div style="height: 1800px;width: 100%;" />
</h:body>
</html>

 

 如果有人可以在IE7或IE8上使用兼容性视图测试此代码以确认错误行为，那将会有所帮助。 
 

 我也想知道这个问题是否与我们在这里使用带有“兼容性视图”的IE8版本而不是独立的IE7（IE8兼容模式是否向服务器发送IE8或IE7标头？）有关。 任何人都可以使用独立的IE7进行测试吗？ 
 

 任何帮助将不胜感激。 

Looking for some help for a small display bug. Here is a code sample running on JBoss 7.0.2.Final with IceFaces 2.0.2 :
 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:c="http://java.sun.com/jstl/core" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:ice="http://www.icesoft.com/icefaces/component">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>TEST</title>
<style>
  *{margin: 0;padding: 0;font-family: Helvetica, Arial, Verdana ;font-size: 12px;}
  .mainmenubar{width: 100%;height: 32px;background-color: blue;}
  .mainmenubarItem{float: left;height: 27px;border-right: 1px solid white;padding-top: 5px;}
  .mainmenubarItem a, .mainmenubarItem a:hover, .mainmenubarItem a span{color: white;font-size: 16px;font-weight: bold;text-decoration: none;}
  .mainmenubarSubMenu{position: absolute;background-color: #F5F5F5;}
  </style>
</h:head>
<h:body>
  <div style="background-color: grey; width: 100%; height: 50px;" />
    <ice:form id="menuform">
      <ice:menuBar styleClass="mainmenubar" orientation="horizontal">
        <ice:menuItem styleClass="mainmenuitem" id="mainmenu1" onclick="return false;" value="MENU1">
          <ice:menuItem value="SUBMENU1" styleClass="submenuitem" id="submenu1" onclick="return false;" />
          <ice:menuItem value="SUBMENU1" styleClass="submenuitem" id="submenu2" onclick="return false;" />
        </ice:menuItem>
        <ice:menuItem styleClass="mainmenuitem" id="mainmenu2" onclick="return false;" value="MENU2" />
      </ice:menuBar>
    </ice:form>
  <div class="bottom" style="background-color: yellow; width: 100%; height: 1800px;" />
</h:body>
</html>

 

Seems I cannot directly upload files attached to this post to show screenshots. However, you should be able to copy/paste this code into any IceFaces project with similar configuration, open an IE7 version (in fact I do use IE8 with "compatibility view" mode activated, wonder if it has an effect).
 

If you do not scroll the page and hover the MENU1, you'll see the SUBMENU correctly displayed. However, if you scroll a little the page to have the menu on top of the page and hover the MENU1, you'll see that the SUBMENU is displayed about 50px under the menu. consequently, you'll never be able to click on the second menu...
 

Cannot figure out why this does not work. I had a look at the IceFaces showcase on http://component-showcase.icefaces.org/component-showcase/showcase.iface and saw it does work on my IE version (cannot really attest the showcase do use the same version of IceFaces as I do).
 

I made an additional test : taking the showcase code locally shows the same behaviour (with bug). Here is the exact code I'm running :
 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html" xmlns:c="http://java.sun.com/jstl/core" xmlns:f="http://java.sun.com/jsf/core" xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:ice="http://www.icesoft.com/icefaces/component">
<h:head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>TEST</title>
<link rel="stylesheet" type="text/css" href="http://component-showcase.icefaces.org/component-showcase/xmlhttp/css/rime/rime.css" />
<link rel="stylesheet" type="text/css" href="http://component-showcase.icefaces.org/component-showcase/css/showcase_style.css" />
<link rel="stylesheet" type="text/css" href="http://component-showcase.icefaces.org/component-showcase/css/showcase_overrides.css" />
<link rel="stylesheet" type="text/css" href="http://component-showcase.icefaces.org/component-showcase/css/showcase_layout.css" />
</h:head>
<h:body>
   <ice:panelGroup styleClass="componentBox">

     <ice:panelGroup styleClass="synopsisBox menuBarContainer">
       <ice:outputText value="The menuBar component provides a robust menu system." />
       <ice:outputText value="In the box below, choose the orientation of the Menu Bar and then select a menu item. The backing been value of the selected item will be reflected under Server-side Backing Bean Values." />
     </ice:panelGroup>

     <ice:panelGroup styleClass="clearer" />

     <!-- main menu declaration  -->
     <ice:panelGroup styleClass="exampleBox menuBarContainer">
       <ice:menuBar id="menuBar" orientation="horizontal">
         <!-- File menu -->
         <ice:menuItem value="File" id="file" onclick="return false;">
           <ice:menuItem onclick="return false;" id="open" value="Open" icon="http://component-showcase.icefaces.org/component-showcase/images/menu/open.gif"></ice:menuItem>
           <ice:menuItem id="close" value="Close" onclick="return false;"></ice:menuItem>
           <ice:menuItem id="recent" value="Recent" icon="http://component-showcase.icefaces.org/component-showcase/images/menu/recent.gif" onclick="return false;">
             <ice:menuItem id="file1" value="File 1" onclick="return false;"></ice:menuItem>
            <ice:menuItem id="file2" onclick="return false;" value="File 2">
            <ice:menuItem id="para1" onclick="return false;" value="Para 1"></ice:menuItem>
              <ice:menuItem id="para2" value="Para 2" onclick="return false;"></ice:menuItem>
              <ice:menuItem id="para3" value="Para 3" onclick="return false;"></ice:menuItem>
            </ice:menuItem>
            <ice:menuItem value="File 3" id="file3" onclick="return false;"></ice:menuItem>
            <ice:menuItem value="File 4" id="file4" onclick="return false;"></ice:menuItem>
          </ice:menuItem>

          <ice:menuItem id="save" icon="http://component-showcase.icefaces.org/component-showcase/images/menu/save.gif" value="Save" onclick="return false;"></ice:menuItem>
          <ice:menuItemSeparator />
          <ice:menuItem id="print" icon="http://component-showcase.icefaces.org/component-showcase/images/menu/print.gif" value="Print" onclick="return false;"></ice:menuItem>

        </ice:menuItem>

        <!-- Edit menu -->
        <ice:menuItem value="Edit" id="edit" onclick="return false;">
          <ice:menuItem id="cut" value="Cut" onclick="return false;"></ice:menuItem>
          <ice:menuItem id="copy" value="Copy" onclick="return false;"></ice:menuItem>
          <ice:menuItem id="paste" value="Paste" onclick="return false;"></ice:menuItem>
        </ice:menuItem>

        <!-- View menu -->
        <ice:menuItem value="View" id="view" onclick="return false;">
          <ice:menuItem id="zoom_in" value="Zoom In" icon="http://component-showcase.icefaces.org/component-showcase/images/menu/zoomin.gif" onclick="return false;"></ice:menuItem>
          <ice:menuItem id="zoom_out" value="Zoom Out" icon="http://component-showcase.icefaces.org/component-showcase/images/menu/zoomout.gif" onclick="return false;"></ice:menuItem>
          <ice:menuItem id="fit_in_window" value="Fit In Window" icon="http://component-showcase.icefaces.org/component-showcase/images/menu/fitinwindow.gif" onclick="return false;"></ice:menuItem>
          <ice:menuItem id="actual_size" value="Actual Size" icon="http://component-showcase.icefaces.org/component-showcase/images/menu/actualsize.gif" onclick="return false;"></ice:menuItem>
        </ice:menuItem>

        <!-- Help Menu -->
        <ice:menuItem value="Help" id="help" onclick="return false;">
          <ice:menuItem id="docs" value="Documentation" icon="http://component-showcase.icefaces.org/component-showcase/images/menu/help.gif" link="http://www.icefaces.org/main/resources/documentation.iface" target="_blank" />
        </ice:menuItem>

      </ice:menuBar>
    </ice:panelGroup>

    <ice:panelGroup styleClass="clearer" />

  </ice:panelGroup>
  <div style="height: 1800px;width: 100%;" />
</h:body>
</html>

 

If someone can test this code on IE7 or IE8 with compatibility view to confirm the bugged behavior, would already help.
 

I do also wonder if this problem is related to the fact we do use here an IE8 version with "compatibility view" and not a standalone IE7 (does IE8 with compatibility mode send IE8 or IE7 headers to the server ?). Can anyone test with a standalone IE7 ?
 

Any help will be greatly appreciated.

原文：https://stackoverflow.com/questions/8492385
更新时间：2022-05-20 22:05

最满意答案

 你似乎没有将jquery库加载到文档中： 
 

 将此添加到头部： 
 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

 

 以下只是您现有的代码与该更改（以及将单击功能包装在文档就绪的包装器中）并且它不会出现错误并在按钮单击时控制消息。 
 

 

 
 
 
  
<!DOCTYPE html>
<html>
<head>  
<title>Login Page</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<style type="text/css">
        html,body{height: 100%; padding:0; margin:0;}
        form{ width:30em;height:9em; margin:-5em auto 0 auto; position: relative; top:50%; border:1px dotted #ccc; padding:.25em; }
        fieldset{ margin:0;   border:0;padding:0;}
        legend{float:left; font-size: 200%; text-align: center; color:blue; font-weight: bold; border-bottom: 1px solid blue; width:15em;  padding:0; }
        label, label+ input {display:inline; float:left;margin-top:1em;}
        label{text-align: right; width:28%; clear: left; margin-top:.8em; }
        label+ input{ width:60%; padding:.25em; ; margin-left:.5em; border: 1px inset;  margin-left: }
        #sub{  margin-top:1em; position: relative; float:left;clear: left; margin-left: 29%}
</style>
</head>
<body>

    <form >
        <fieldset><legend>My Login</legend>
            <label for="username">UserName: </label><input  type="text" name="username" id="username" value="">
            <label for="password">Password: </label><input  type="password" name="password" id="password" >
            <input type="button" name="theButton" value="Submit" class="btn" data-username="username" />
        </fieldset> 
    </form>

<script>

console.log("Am I present?");
$(document).ready(function(){
  $(document).on('click', '.btn', function() {
    var name = $('#username').val();
    console.log("Am I Inside?");
    console.log("name: " +name);
    if (name != undefined && name != null) {
        window.location = 'http://localhost/local/RegistryWS/src/main/webapp/home.html?username=' + name;
    }
  });
 });



</script>


</body>
</html>
 
 
 

 


you do not seem to be loading the jquery library into the document: 
 

add this into the head:
 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

 

the following is just your existing code with that change (as well as wrapping the click function in a document ready wrapper) and it doesn't error and consoles the message on the button click.
 

 

 
 
 
  
<!DOCTYPE html>
<html>
<head>  
<title>Login Page</title>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<style type="text/css">
        html,body{height: 100%; padding:0; margin:0;}
        form{ width:30em;height:9em; margin:-5em auto 0 auto; position: relative; top:50%; border:1px dotted #ccc; padding:.25em; }
        fieldset{ margin:0;   border:0;padding:0;}
        legend{float:left; font-size: 200%; text-align: center; color:blue; font-weight: bold; border-bottom: 1px solid blue; width:15em;  padding:0; }
        label, label+ input {display:inline; float:left;margin-top:1em;}
        label{text-align: right; width:28%; clear: left; margin-top:.8em; }
        label+ input{ width:60%; padding:.25em; ; margin-left:.5em; border: 1px inset;  margin-left: }
        #sub{  margin-top:1em; position: relative; float:left;clear: left; margin-left: 29%}
</style>
</head>
<body>

    <form >
        <fieldset><legend>My Login</legend>
            <label for="username">UserName: </label><input  type="text" name="username" id="username" value="">
            <label for="password">Password: </label><input  type="password" name="password" id="password" >
            <input type="button" name="theButton" value="Submit" class="btn" data-username="username" />
        </fieldset> 
    </form>

<script>

console.log("Am I present?");
$(document).ready(function(){
  $(document).on('click', '.btn', function() {
    var name = $('#username').val();
    console.log("Am I Inside?");
    console.log("name: " +name);
    if (name != undefined && name != null) {
        window.location = 'http://localhost/local/RegistryWS/src/main/webapp/home.html?username=' + name;
    }
  });
 });



</script>


</body>
</html>

相关问答

更多

  • 未捕获的SyntaxError：意外的令牌<进入DOCTYPE html PUBLIC(Uncaught SyntaxError: Unexpected token < into DOCTYPE html PUBLIC)[2023-06-12]

    该错误消息表示JavaScript语法错误。 您引用的代码是XHTML，它不是JavaScript。 试图将其视为JavaScript（正如您所做）注定要失败。 这可能是由于在src属性中输入了错误的URL。 The error message indicates a JavaScript syntax error. The code you quoted is XHTML, which is not JavaScript. Trying to treat it as JavaScript (as you ...

  • 未捕获的SyntaxError：无效或意外的令牌弹簧启动(Uncaught SyntaxError: Invalid or unexpected token spring boot)[2022-03-12]

    我想你错过了); 在您的脚本代码如下： - $(document).ready(function () { function redirectToEditPost(){ window.location = '/editPost/' + $('input#postId').val(); } }); I think you missing ); after your script code like below:- $(document).ready(function () { ...

  • 未捕获的SyntaxError：意外的令牌<(Uncaught SyntaxError: Unexpected token <)[2023-01-29]

    浏览器在请求a.config.js时看到了什么？ 也许有一些URL重写涉及。 What does the browser see when it requests a.config.js? Maybe there is some URL rewriting involved.

  • JQuery：未捕获的SyntaxError：无效或意外的令牌(JQuery: Uncaught SyntaxError: Invalid or unexpected token)[2024-01-28]

    使用反引号`多行字符串 console.log(` multi line string here `); Use backtick ` for multiline string console.log(` multi line string here `);

  • Gulp：Uncaught SyntaxError：无效或意外的令牌(Gulp: Uncaught SyntaxError: Invalid or unexpected token)[2022-01-19]

    听起来像gzip工作正常，但您的浏览器可能无法解码压缩文件，因为（我猜）您的标头未正确设置。 你需要这些： Content-Type: application/javascript Content-Encoding: gzip 在此处查看更多信息： https ： //developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Encoding Sounds like gzip is working fine, but your browser ma ...

  • （未捕获的SyntaxError：意外的令牌:) - 怎么办？(( Uncaught SyntaxError: Unexpected token : ) - What to do?)[2024-05-03]

    JSON和JSONP之间差异的简短说明 JSON是一种字符串格式，表示Javascript表示法中的对象文字。 例： '{"number":36, "sqrt": 6}' JSONP是一种字符串格式，表示理想情况下包含JSON作为此方法调用的参数的Javascript方法调用 例： mycallback('{"number":36, "sqrt": 6}'); 如果服务提供JSON响应，则它不会自动提供JSONP响应。 必须显式配置服务器脚本才能执行此操作。 您不能假设您的服务器脚本为您提供了JSONP ...

  • 未捕获的SyntaxError：即使语法正确，也会出现无效或意外的令牌(Uncaught SyntaxError: Invalid or unexpected token even with correct syntax)[2023-03-27]

    你似乎没有将jquery库加载到文档中： 将此添加到头部： 以下只是您现有的代码与该更改（以及将单击功能包装在文档就绪的包装器中）并且它不会出现错误并在按钮单击时控制消息。 Login Page