JavaScript登录按钮适用于IE,但不适用于Chrome或Firefox

时间:2016-08-09 09:10:10

标签: javascript html google-chrome firefox xslt

我有一个非常简单的网页,要求用户输入登录名和密码并按下登录按钮。这在IE浏览器中完全正常,但在Chrome或Firefox中没有,任何人都可以告诉我为什么或指向正确的方向吗?

<?xml version="1.0" encoding="iso-8859-1" ?>
<xsl:stylesheet type="application/xsl" xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">

<xsl:template match="/">

<html>

<head>


<title>Test Online Login</title>

<script>

<xsl:if test="VFILE_DATA/LOGGED_IN='TRUE'">

  // Logged in OK so run menu

 document.URL = "http://gla-web01:91/scripts/test.wsc/vfxmlsws.p?" +
                "function=system_blank" +
                "&amp;xsl=Personal.xsl" +
                "&amp;session_key=<xsl:value-of select="VFILE_DATA/SESSION_KEY"/>";

</xsl:if>


function login(){

  // Check to see if login parameters are correct

  document.URL="http://gla-web01:91/scripts/test.wsc/vfxmlsws.p?"+"function=user_login"+"&amp;server_translate=false"+"&amp;xsl_dir=/vfile_test"+"&amp;user_id="+user.value+"&amp;password="+password.value+"&amp;xsl=install_login.xsl";

}

function checkReturnKey(){
    // Test to see if the return key has been pressed
    if ( event.keyCode == 13 )
      login();
  }

</script>
                    <style>
                table {
                    border-collapse: collapse;
                    width: 100%;
                    font-family:calibri
                }

                th, td {
                    text-align: left;
                    padding: 8px;
                    font-family:calibri
                }

                tr:nth-child(even){background-color: #E4E4E4}

                th {
                    background-color: #eedaff;
                    color: black;
                    text-align: left;
                    font: 16px/24px Helvetica Neue, "Arial", Helvetica, Verdana, sans-serif;
                    width: 100%;
                }

                label {    
                    color: #666;
                    text-align: left;
                    font: 16px/24px Helvetica Neue, "Arial", Helvetica, Verdana, sans-serif;
                    width: 100%;

                }
                </style>
</head>


<body>

<div id="title"><h2>Test User Login</h2>
<hr></hr></div>



  User:<input id="user" type="text" onkeypress="checkReturnKey()"/>

  Password:<input id="password" type="password" onkeypress="checkReturnKey()"/>


  <input class="loginButton" type="button" value="Login" onclick="login()"/>  
    <button onclick="login()">Login2</button>
<xsl:if test="VFILE_DATA/LOGGED_IN='FALSE'">
<P/>
Invalid Login

</xsl:if>


</body>

</html>

</xsl:template>
</xsl:stylesheet>

正如您所看到的,我尝试了两种不同的登录按钮编码方法,这两种方法都适用于IE,但在Chrome或FireFox中都没有。

我已经阅读了几个类似的主题:

Why this button works in IE but not in Firefox?

XSLT works in IE, not in Chrome or Firefox

Why this button works in IE but not in Firefox?

Javascript works in IE but not in Chrome

javascript works in IE but not in firefox

但没有任何帮助。我敢肯定它必须是非常简单的东西,我很想念,但无法理解它!

谢谢,

2 个答案:

答案 0 :(得分:0)

(此 是重复的。)

keyCode是特定于Microsoft的。它在其他浏览器上which。所以:

function checkReturnKey(){
    // Test to see if the return key has been pressed
    if ( (event.keyCode || event.which) == 13 ) {
        login();
    }
}

这是因为JavaScript的curiously-powerful || operator,它没有布尔结果;相反,如果该操作数是 truthy ,则其结果是第一个操作数,否则是第二个操作数。因此,如果event.keyCode是真值(undefined是假的),我们会将13与该值进行比较;如果它是假的(例如undefined),我们会将event.which13进行比较。

我相信你也希望在keydown而不是keypress上这样做; e.g:

<input id="user" type="text" onkeydown="checkReturnKey()"/>
<!-- -----------------------------^^^^                  -->

答案 1 :(得分:0)

确定结果很简单,本来应该使用location.href代替document.url才能在Chrome中使用。