HTML does not recognize jQuery (imported or internal)

0

I have already researched several topics and have not found the problem. The jQuery function does not work on my page, and when I give f12 in the chrome browser, it informs that jquery is not imported (Uncaught ReferenceError: $ is not defined javascript). I was using jquery on the machine, and I switched to cdn and the problem persists. I guess it's a relatively silly thing, but I've been trying to solve the problem for days.

html:

<!DOCTYPE html>
<html>
<head>
	<title>Semana da Engenharia</title>
	<meta charset="utf-8">
	**<script src="js/js.js" type="text/javascript"></script>**
	**<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"type="text/javascript"></script>**
	<!-- responsável pelas funções de máscara em jQuery -->
	**<script src="js/jquery.mask.min.js" type="text/javascript"></script>**
	<link rel="stylesheet" type="text/css" href="cssIndex.css">
	<!-- responsável pelas funções em boostrap -->
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script><!--responsávelporinstanciarosicones--><linkrel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">

</head>
<body>
	<img src="bannerWeek.jpg" id="bannerWeek">

		<div id="divLogin">
			<select required id="comboboxLogin">
				<option value="" disabled selected>Selecione o tipo de usuário</option>
				<option value="administrador">Administrador</option>
				<option value="visitante">Visitante</option>
			</select>
			
			<input type="text" name="senhaUsuario" id="senhaLogin" placeholder="Informe sua senha">
			<span class="iconInPasswordField"><i class="fa fa-lock"></i></span>

			<span id="iconInPasswordField" data-toggle="tooltip"
			title="A sua senha é o seu RA!"><i class="fa fa-info"></i></span>

			<input type="submit" value="ACESSAR" id="btnAcessar" onclick="enviarLogin()">
		</div>

		<span id="edicao2019">6º Edição - 2019</span>
		<span id="unifaeLogo">UNI<span style="color: red">FAE</span></span>
</body>
</html>		

javascript:

/*responsavel pela mensagem de ajuda "qual minha senha?"
  o que ele faz realmente?*/

$(document).ready(function(){
	$("#senhaLogin").mask("99999-9");	
    $('[data-toggle="tooltip"]').tooltip();   
});

/* redireciona para a respectiva página de acordo com o usuário*/
function enviarLogin(comboboxLogin) {
	var op = document.getElementById("comboboxLogin").value;

	if(op == "visitante") {
		window.location.href = "userPage.html";
	}
	else
		if (op == "administrador") {
		window.location.href = "admPage.html";
		}
		else
			alert("Informe o tipo de usuário!");
}
    
asked by anonymous 26.10.2018 / 19:28

2 answers

0

Try this way, basically you are calling the file with the functions before adding the library.

<!DOCTYPE html>
<html>
<head>
    <title>Semana da Engenharia</title>
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="cssIndex.css">
    <!-- responsável pelas funções em boostrap -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <!-- responsável por instanciar os icones -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">

</head>
<body>
    <img src="bannerWeek.jpg" id="bannerWeek">

        <div id="divLogin">
            <select required id="comboboxLogin">
                <option value="" disabled selected>Selecione o tipo de usuário</option>
                <option value="administrador">Administrador</option>
                <option value="visitante">Visitante</option>
            </select>

            <input type="text" name="senhaUsuario" id="senhaLogin" placeholder="Informe sua senha">
            <span class="iconInPasswordField"><i class="fa fa-lock"></i></span>

            <span id="iconInPasswordField" data-toggle="tooltip"
            title="A sua senha é o seu RA!"><i class="fa fa-info"></i></span>

            <input type="submit" value="ACESSAR" id="btnAcessar" onclick="enviarLogin()">
        </div>

        <span id="edicao2019">6º Edição - 2019</span>
        <span id="unifaeLogo">UNI<span style="color: red">FAE</span></span>
</body>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"type="text/javascript"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script><scriptsrc="js/jquery.mask.min.js" type="text/javascript"></script> 
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.15/jquery.mask.js"type="text/javascript"></script> -->
    <script src="js/js.js" type="text/javascript"></script>
</html>        
    
26.10.2018 / 19:33
0

Try removing the type="text/javascript" attribute from the jQuery script tags. That may be what it's holding back. In fact, it is not mandatory, as the W3Schools site says, because JavaScript is the default scripting language.

Removed and adapted from W3Schools :

  

Want to know why we do not have type="text / javascript" within the tag <script> ?

     

This is not required in HTML5. JavaScript is the default scripting language in HTML5 and all modern browsers!

In an app I got to develop, and use jQuery, I had not put the type="text/javascript" attribute at the time of importing it, and it worked perfectly.

I hope I have helped!

    
27.10.2018 / 14:47