Java external html page script not working

Asked

Viewed 2,413 times

1

I’m having a problem on my pages after trying to put js in an external file it just crashed, and I couldn’t find the error so far.

Follows the codes

HTML

<script type="text/javascript" src="funcjs.js"></script>//dentro da tag head
<a href="javascript:showhide('login')" style="float:right;" >Login</a>//dentro da tag body

JS (inside the funcjs.js file)

Initially he was like this:

function showhide(id) {
   var e = document.getElementById(id);
   e.style.display = (e.style.display == 'inline') ? 'none' : 'inline';
}

but after researching and finding it: The HTML page is not "calling" Javascript

was like this

showhide = function (id) {
   var e = document.getElementById(id);
   e.style.display = (e.style.display == 'inline') ? 'none' : 'inline';
}

When the 1 JS code was on the html page itself it was working normally, I did not make any changes to the html code after the change, there is something wrong in the way I am trying to call this function?

EDIT:FOLLOWS THE TAG HEAD OF THE COMPLETE CODE AS WELL AS DIV SHOWHIDE

HEAD

<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,user-scalable=no">
<link href='https://fonts.googleapis.com/css?family=Oswald:400,300' rel='stylesheet' type='text/css'>
<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<link href="style.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script type="text/javascript" src="funcjs.js"></script>
<script src='https://www.google.com/recaptcha/api.js?hl=pt-BR'></script>

DIV

<div id="login" style="display:none;">
            <form action="login.php" method="POST" enctype="multipart/form-data">
                <p><input type="text" name="usuario" id="usuario" placeholder="Usuário"></p>
                <p><input type="password" name="senha" id="senha" placeholder="Senha"></p>
                <p><input type="submit" value="login" id="entrar"/></p>
                <input type="hidden" name="entrar" value="login">
                <p value="error" style="display:none;">por favor preencha os campos!</p>
            </form>
</div>

OBS: I use this script on almost every page, and the only thing they share is the head, and in none of them worked after putting the code in the external file.

1 answer

1

Hello. As the test I did is working normally its function. The example that shows in The HTML page is not "calling" Javascript shows that the external . js file was called inside the /js folder. The example I did to simulate your situation was with all the files inside the same folder and added the div with id='login' that was not in your example.

Make sure that the correct path of your . js file is correctly referenced; Make sure the element exists with id='login'.

  • Yes the id is correct, and the path is also because I opened the source code and the link that references it was opening the code correctly, I’m not really understanding the reason why it doesn’t work...

  • Post the whole html to analyze it better please.

  • I put all part of the code that I believe may be causing some conflict, as the page is kind of large I find it difficult to post it complete here.

  • Hello Jessica. I redid the example and it still worked correctly with the html and the contents of the header you provided me. There is also the possibility that your file . js is being incorrectly referenced. What is the error of the browser console when you try to click on the 'Login' link? Are the file of your page and the file funcjs.js in different folders? Just by confirming, the effect you want when you hit the 'Login' link is to show/hide the form is not?

  • Yes I need it to hide/show this form, as I said earlier the file is being referenced correctly, is in the same folder, does not return me any error, it just does not show/hide function. I’m really not able to understand, since it is not only on this page that is not working and I have other pages much simpler in which the error persists.

  • @Wel, see if this is the expected <https://liveweave.com/#&togetherjs=oOa67SEqiG>

  • I don’t understand, the code you sent doesn’t seem to have any connection with what I posted...

  • Buddy, it’s just the code you posted above. Tell me what differs, because as you mentioned earlier, it should hide and show the form to the link click, and that’s what’s happening.

  • ok, but in case the code is not working because it is in the same file in this case? Because even removing the js reference inside the head tag it keeps working, and as I said the code only stopped working after putting it in an external file...

  • Yes, I put the code there just to confirm its functioning, because as I mentioned, the code works in the external archive here on my machine. You would happen to have that code in Git?

Show 5 more comments

Browser other questions tagged

You are not signed in. Login or sign up in order to post.