Jquery code $ accuses that is not set

Question

Good afternoon. I was tidying up the code (cleaning) and when I see it on the Chrome console, it accuses that $ is not defined.

Code jQuery:

$(document).ready(function () {
    $('form').attr("autocomplete", "off");
});

In the first line of the code it shows that it is not set.

Html code:

<script src="~/Scripts/LoginAccount.js"></script>
<div id="fb-root"></div>
<section class="login-page">
    <div class="row">
        <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
            <h2 class="">Faça seu login</h2>
            <h3 class="">Preencha o formulário com seu usuário e senha</h3>
            @if (ViewBag.SrcUrl == "landingPageGuiaComercial")
            {
                var returnUrl = "/usuario/hotsites";
                using (Html.BeginForm(new { returnUrl }))
                {
                    @Html.ValidationSummary(true, "Tentativa mal sucedida. Por favor corrija os erros e tente novamente.", new { @class = "alert alert-danger" })

                    <div class="form-group">
                        @Html.TextBoxFor(m => m.UserName, new { maxlength = "30", placeholder = "Usuário", autocomplete = "off", @class = "form-control inputusuario" })
                    </div>
                    <div class="form-group">
                        @Html.PasswordFor(m => m.Password, new { maxlength = "30", placeholder = "Senha", autocomplete = "off", @class = "form-control inputsenha" })
                    </div>
                    <div class="checkbox">
                        <label>
                            @Html.CheckBoxFor(m => m.RememberMe) Lembre-me
                        </label>
                    </div>

                    <input type="submit" value="Entrar" class="btn btn-success btnentrar" />
                    @Html.ActionLink("Esqueci minha senha", "ForgotPassword", null, new { @class = "forgot btn btn-warning btnsenha" })
                    <a href="/usuario/cadastrar?srcUrl=landingPageGuiaComercial" class="register btn btn-primary btnnovo">Novo Cadastro</a>
                }
            }
            else
            {
                using (Html.BeginForm(new { ViewBag.ReturnUrl }))
                {
                    @Html.ValidationSummary(true, "Tentativa mal sucedida. Por favor corrija os erros e tente novamente.", new { @class = "alert alert-danger" })

                    <div class="form-group">
                        @Html.TextBoxFor(m => m.UserName, new { maxlength = "30", placeholder = "Usuário", autocomplete = "off", @class = "form-control inputusuario" })
                    </div>
                    <div class="form-group">
                        @Html.PasswordFor(m => m.Password, new { maxlength = "30", placeholder = "Senha", autocomplete = "off", @class = "form-control inputsenha" })
                    </div>
                    <div class="form-group">
                        <label class="radio-inline">
                            @Html.CheckBoxFor(m => m.RememberMe) Lembre-me
                        </label>
                        <label class="checkbox-inline">
                            @Html.RadioButtonFor(m => m.EditAccount, true, new { @checked = "checked" }) Editar meu cadastro
                        </label>
                        <label class="checkbox-inline margin-left">
                            @Html.RadioButtonFor(m => m.EditAccount, false, new { @class = "margin-left" }) Continuar navegando
                        </label>
                    </div>
                    <div class="form-group center">
                        <input type="submit" value="Entrar" class="btn btn-success btnentrar" />
                        @Html.ActionLink("Esqueci minha senha", "ForgotPassword", null, new { @class = "forgot btn btn-warning btnsenha" })
                        @Html.ActionLink("Novo Cadastro", "Register", null, new { @class = "register btn btn-primary btnnovo" })
                    </div>
                }
            }
            @if (ViewBag.SrcUrl == "landingPageGuiaComercial")
            {
                <div class="videoLandingPageGuiaComercial">
                    <a href="http://www.abcdoabc.com.br/Embed/23" title="Apresentação do Hotsite" class="shadowbox600450">
                        <strong>VEJA O VÍDEO DE APRESENTAÇÃO DO HOTSITE</strong>
                        <img src="@Url.Content("~/Images/landingpage/apresentacao-video.jpg")" alt="Apresentação do Hotsite" class="img-responsive" />
                    </a>
                </div>
            }

        </div>

        @if (ViewBag.SrcUrl == "landingPageGuiaComercial")
        {
            <div class="adLandingPageGuiaComercial">
                <img src="@Url.Content("~/Images/landingpage/landingpage-publicidade-login.jpg")" alt="Entrar ou Cadastre-se" class="img-responsive" />
                <h3>ENTRE EM CONTATO</h3>

                <p>
                    <strong>
                        Aqui você poderá solicitar a criação de seu Hotsite pela agência!
                    </strong><br />
                    Envie um e-mail que entraremos em contato ou ligue para o número abaixo
                </p>

                @using (Ajax.BeginForm("EnviarEmailCriarHotsite", "Home", null, null, new { @class = "form", role = "form", style = "width:550px" }))
                {
                    <div class="form-group">
                        @Html.TextBox("Nome", null, new { placeholder = "Nome", @class = "form-control" })
                    </div>
                    <div class="form-group">
                        @Html.TextBox("Email", null, new { placeholder = "E-mail", @class = "form-control" })
                    </div>
                    <div class="form-group">
                        @Html.TextBox("Telefone", null, new { placeholder = "Telefone", @class = "form-control" })
                    </div>
                    <div class="form-group">
                        @Html.TextArea("Mensagem", new { placeholder = "Mensagem", @class = "form-control" })
                    </div>
                    <input type="submit" value="Enviar" class="btn btn-default" />
                    <div class="telefone"><strong>TELEFONE PARA CONTATO:</strong> 11 4421-3426</div>
                }
        }
    </div>
</section>

Note: Always occurs when there is $(document).ready(function () .... If I know how to solve this, the others who accuse the same thing, I will succeed.

Answer 1

This problem may be caused by some factors:

1. Order in which scripts are included. If you put the javascript that uses jQuery before the jQuery inclusion, jQuery will not have been loaded, causing this error.

Example:

<script>
  $(function () {
      $('#item').click(function () {
          alert('olá');
      });
  });
</script>
<!-- errado o jQuery deveria estar antes -->
<script src="js/jquery.js"></script>

2. jQuery was not included. You may have accidentally removed the chunk of code that included the jQuery script.

3. Linked jQuery script path does not exist. You may have renamed or misplaced it, trying to point to jQuery.

These are causes that I raised, taking into account that the mistake was on the part of those who are programming. I’m not crucifying people who make mistakes, I’m just pointing out the points you can analyze when you come across this.