JavaScript login button works in IE but not in Chrome or Firefox

Question

I have a very simple webpage that asks a user for a login and password and to press a login button. This works perfectly fine in IE but not in Chrome or Firefox, can anyone tell me why or point me in the right direction?

<?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>

As you can see I've tried two different methods of coding the login button, both work in IE but neither in Chrome or FireFox.

I've read several similar topics on this:

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

but nothing has helped. I'm sure it must be something really simple I'm missing but can't figure it out!

Thanks,

Answer 1

(This has to be a duplicate.)

keyCode is Microsoft-specific. It's which on other browsers. So:

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

That works because of JavaScript's curiously-powerful || operator , which doesn't have a boolean result; instead, its result is the first operand if that operand is truthy , or the second operand if not. So if event.keyCode is a truthy value ( undefined is falsy), we compare 13 with that value; if it's falsy ( undefined , for instance), we compare event.which with 13 instead.

I believe you also want to be doing this on keydown , not keypress ; eg:

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

Answer 2

好的，事实很简单，应该使用location.href而不是document.url使其在chrome中工作。

JavaScript login button works in IE but not in Chrome or Firefox

Question

2 answers

solution1
0

solution2
0 ACCPTED 2016-08-09 13:07:27

JavaScript login button works in IE but not in Chrome or Firefox

Question

2 answers

solution1 0

solution2 0 ACCPTED 2016-08-09 13:07:27

solution1
0

solution2
0 ACCPTED 2016-08-09 13:07:27