get the html of a $ ('a'). index (this);

Question

get the html of a $ ('a'). index (this);

Navigation

#1 by (2 votes)

1

A simpler example of what I want would be the following:

$(document).ready(function(){
    $('a.excluir').click(function(){
        var i = $('a').index(this);
        alert(i);
    });
});

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><ahref="#" class='excluir'>link 1</a>
<a href="#" class='excluir'>link 2</a>
<a href="#" class='excluir'>link 3</a>

<a href="#" class='cadastrar'>link 4</a>
<a href="#" class='cadastrar'>link 5</a>
<a href="#" class='cadastrar'>link6</a>

With this code I have returned only the a element that received the click.

Now how do you read html() of it?

Using

i.html()

It did not. Neither

i.text()

Official question code:

// JavaScript Document
$(document).ready(function(e) {

  $("a.excluiPlano").click(function() {

      if (confirm('Deseja Excluir este Plano?\nAtenção: Excluindo esse plano, todas as fotos serão excluidas!\nDeseja prosseguir?') ) {

        $.ajax({
            url: "../_requeridos/excluiPlano.php",
            type: 'POST',
            data: {'planoid': $(this).attr('planoid')},
            beforeSend: function() {    

              $(this).html("<img src='../_img/_bannerImgs/spinner.gif' />")

            },
            success: function (retorno) {

                if (retorno == 1) {

                    alert('Excluido com sucesso');
                    location.reload();

                } else {

                    alert("Erro na exclusão");

                }

            },
            cache: false,
            /* REMOVIDAS PARA QUE O AJAX ENVIE VARIÁVEIS FORA DO FORM/
            contentType: false,
            processData: false
            */
        });

        return false;

      }

  })


});

jquery

asked by anonymous 02.06.2018 / 20:17

1 answer

content management in python Unrecognized element (File download)

score 2 · Accepted Answer

You should use html() , but not i (which is the index of the element), but in the element itself that was clicked (in this case, this ):

$(document).ready(function(){
    $('a.excluir').click(function(){
        var texto = $(this).html();
        alert(texto);
    });
});

<script type="text/javascript"   src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><ahref="#" class='excluir'>link 1</a>
<a href="#" class='excluir'>link 2</a>
<a href="#" class='excluir'>link 3</a>

<a href="#" class='cadastrar'>link 4</a>
<a href="#" class='cadastrar'>link 5</a>
<a href="#" class='cadastrar'>link6</a>

In this case, $('a.excluir') only executes the code for the a tags whose class is excluir . You can change the selector according to what you need ( $('a') executes for all links, for example).

But in your case, you are calling this code inside an ajax event, and I believe that in this scope this will no longer refer to the a element, but to some ajax object. In this case, it's best to set this to some variable and use it within beforeSend :

$("a.excluiPlano").click(function() {
    var link = this;
    $.ajax({
    // ...
        beforeSend: function() {    
          // não usar "this" aqui, pois ele provavelmente vai se referir a algum objeto do ajax
          $(link).html("<img src='../_img/_bannerImgs/spinner.gif' />")
        },